so, I have this webpage here [ http://saikonet.org ] and it's not loading the tipsy script. If you go into the source, it's on line 11. Now, the strange part is all the other scripts are loading fine, and if you click on the tipsy script link, it's loads fine in browser, so syntax and filepath are both fine. even stranger is that is was working completely fine last time I checked.. it just stopped working all the sudden. I'm not sure how to proceed..
(and btw, the way I checked whether it's loading or not was via the script tab in chromium's 'inspect element')
It looks like the tipsy script is being loaded before the jquery file where the former is dependent on the latter.
Change:
<script src="/js/jquery.tipsy.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
to:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="/js/jquery.tipsy.js"></script>
You need to load the jQuery file before you load the tipsy JS file.
In your head section, change this:
<script src="/js/modernizr-1.5.min.js"></script>
<script src="/js/jquery.tipsy.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
To This:
<script src="/js/modernizr-1.5.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="/js/jquery.tipsy.js"></script>
On my Chrome it looks like the tipsy script jquery.tipsy.js is being downloaded.
At any rate, I think you may need to put your tipsy script after your jQuery script.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="/js/jquery.tipsy.js"></script>
Related
This is the code I use to show a message on my webpage.
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript" src="jquery-migrate-1.0.0.js"></script>
<script>
$(document).ready(function(e) {
alert('success');
});
</script>
However, after the page loads it shows me nothing.
try loading the jquery files from a cdn, unless you're already hosting it-
e.g.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
edit:
you say it's already apart of your server, I personally prefer making absolute paths to files..
e.g.
<script src="http://your.server.com/path/to/the/files/jquery.1.9.js"
obviously you'll need to get the actual path, and make sure it's got the correct permissions
im using this Color Picker Jquery plugin (http://colpick.com/plugin)
Problem is, i tried same simple code in in .html but when i change just extension to .php, the Color Picker doesnt work, while everything else works.
A simple button and added the important scripts like colpick.js and colpick.css.
Example:
index.html
<html>
<head>
<script src="jquery-2.1.3.min.js"></script>
<script src="canvasSettings.js"></script>
<script src="colpick.js" type="text/javascript"></script>
<link rel="stylesheet" href="colpick.css" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<button id="idColor">Show Color Picker</button>
</body>
</html>
canvasSettings.js
$(document).ready(function()
{
alert("First");
$('#idColor').colpick();
alert("Second");
});
So in index.html, when you click on button, it opens the Color Picker and both alert's show up, all good here.
Problem is, when i change index.html to index.php (when using an php server), the site loads up normaly, button shows up and "First" alert shows up.
But when it reaches the $("#idColor").colpick({}) it doesnt process, "Second" alert doesn't show up.
Have in mind that $("idColor").val() works.
Is there any special way to change this .html into .php even tho the html code is the same?
You've misdiagnosed the problem. It has nothing to do with serving up the HTML from PHP instead of a static file.
Here you load jQuery:
<script src="jquery-2.1.3.min.js"></script>
Then you load the plugin which binds itself to jQuery:
<script src="colpick.js" type="text/javascript"></script>
Then you load jQuery again (but a different version):
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
This overwrites the previous jQuery object and the colour picker plugin that you had bound to it.
Decide which version of jQuery you are going to use (the faster 2.x or 1.x with support for old versions of IE).
Load it before you load the plug in (you are currently doing that for 2.x but not 1.x)
Don't load the other version
SOLVED!
The problem was caused by:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
after i removed that, it worked.
Still need to find a bypass around that, why it caused the problem.
I have a website using twitter bootstrap. When developing sometimes the internet is not working so jquery won't be loaded and my site will not work. This is why I have a local copy of jquery in my js folder. I edited bootstrap files so if jquery is not detected the browser will change the location of jquery from cdn to my local file. I tried to do that but it is not working:Here is my code:
if (!window.jQuery) {
document.getElementById('jq').src='../../js/jquery.js';
console.log("You are using a backup file of jquery provided by our website");
}
else{
console.log("jQuery has been succesfully loaded by kounelios13");
}
html:
<script src="http://code.jquery.com/jquery-1.11.0.min.js" id="jq"></script>
<script src="../../js/bootstrap.js" type="text/javascript"></script>
<script src="../../js/prefixfree.js" type="text/javascript"></script>
<script src="../../js/apps/rgba.js" type="text/javascript"></script>
This is placed inside bootstrap's js file.
Any ideas???
Imaging that CDN file is not available. Then browser starts loading next script file (bootstrap.js), parser enters bootstrap.js, where you placed your check for jQuery. Your code detects that jQuery is not loaded and the script then changes src of the jq tag. It works fine and jQuery starts loading, however browser doesn't wait until jQuery is downloaded and carry on to the Bootstrap stuff, which fails immediately, because it requires jQuery. Hence the error.
You can try this version for backup jQuery library instead which should be reliable:
<script src="http://code.jquery.com/jquery-1.11.0.min.js" id="jq"></script>
<script>
if (!window.jQuery) {
document.write("<script src='../../js/jquery.js'>\x3C/script>");
}
</script>
<script src="../../js/bootstrap.js" type="text/javascript"></script>
<script src="../../js/prefixfree.js" type="text/javascript"></script>
<script src="../../js/apps/rgba.js" type="text/javascript"></script>
With jquery I don't thinks bootstrap script work so you need that.
If you have internet problem then you can copy jquery link and make file of that and attached.
ID must unique for the Document, you have another Element that uses the id jq or none.
I wanted to use the loading page from here http://www.gayadesign.com/diy/queryloader-preload-your-website-in-style/
because the personal website I was making is very poorly optimized and loads quite slowly
The loading page works fine if I make it a seperate page and then redirect to my home page like so:
http://matthewpiatetsky.com/cs103/demo/demo.html
However, I have also tried adding this same animation when I go directly to the page, and it does not work. I think this is because of the other js files present in the document.
http://matthewpiatetsky.com/cs103/
In the redirecting page the script is located here and it works.
http://matthewpiatetsky.com/cs103/demo/js/script.js
In the actual page the script is located here and it doesn't work.
http://matthewpiatetsky.com/cs103/js/matthew.js
The script declarations in the actual page look like this, so this script is called last. Calling it first breaks the page, so I'm guessing the 5-grid js is the problem.
<script src="js/jquery-1.9.1.min.js"></script>
<script src="css/5grid/init.js?use=mobile,desktop"></script>
<script src="js/jquery.formerize-1.1.js"></script>
<script src="js/init.js"></script>
<script src="path/to/file/jquery.queryloader2.js" type="text/javascript"></script>
<script type="text/javascript" src="js/matthew.js"></script>
It looks like you are missing a plugin. Your code tries to use the QueryLoader2 plugin on line 19 of Matthew.js, but you don't have this plugin included on your page.
I've never had a problem until recently, but for some reason when I link my JS files, they won't execute at all. jQuery works, but any files that require jQuery such as easing, and other concept files, they refuse to run in any browser on my machine.
But, here's the odd part. If I wrap all my code in 'script' tags within the HTML document, everything works fine; no issues, bugs, anything. (jquery.js is still linked to the document too).
I'm using Dreamweaver, which tells me they are correctly linked. I'm totally lost by this, I can't work it out.
Here's the HTML: http://jsbin.com/iyagub/1
I don't understand what could cause the JS files to not work.
I'm running it locally, but not on localhost, instead via Windows Explorer. I'm on Windows 8 64-bit. I'm not sure if this is a security issue, but I can't see how as I've said; it all worked fine before like any other project I've worked on.
Remember, if I paste any of the code from the linked JS files in to the HTML document directly with script tags, it works flawlessly.
Does anyone have any idea what it could be?
In your JSBin example:
<script src="js/script.js" type="text/javascript"></script>
<script src="js/totop.js" type="text/javascript"></script>
<script src="js/easing.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
Change the order to:
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/totop.js" type="text/javascript"></script>
<script src="js/easing.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>
Your problem arises from jquery not being loaded into the document before other scripts try and use it.
If you open your URL in a browser with an opened console: e.g. Firefox + firebug
you will notice some of your scripts are failed to loading.
For example :
http://jsbin.com/iyagub/js/easing.js
is not found.
This could be due to many reason:
Wrong paths?
Wrong server configurations?
A misplaced .htacces with bad Rewritecond -s ?