Doing a jQuery slideshow - I get a ? mark
I am building a slideshow using jQuery 1.7.1. There's one annoying bug. I see a little question mark in the top-left of the slideshow. The slideshow seems to be unaffected otherwise, but I do want to get rid of the question mark.
I took code from a related blog post on JonRaasch.com and altered the code so that became
Code:
$(document).ready(function() {
because my browser was complaining that it could not find the variable $. Now, it's not complaining.
Other than that & using different image URLs, I did not alter the code.
The slideshow div is wrapped in another div, which is wrapped in another div. But as far as I know, that's completely irrelevant.
Re: Doing a jQuery slideshow - I get a ? mark
Can you post either your [complete] code, or a URL to view your implementation? "$(function() {" and "$(document).ready(function() {" are synonymous in jQuery, so changing from one to the other should have no discernable effect.
Re: Doing a jQuery slideshow - I get a ? mark
Quote:
Originally Posted by
SambaNeko
Can you post either your [complete] code, or a URL to view your implementation? "$(function() {" and "$(document).ready(function() {" are synonymous in jQuery, so changing from one to the other should have no discernable effect.
Sure.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>******</title>
<!--[if IE]><script>document.write('<base href="' + location.protocol + '//' + location.host + location.pathname.replace(/\/[^\/]*$/, '/mobile/') + '"/>')</script><![endif]-->
<base href="mobile/">
<script id="DC_baseScript">if(navigator.userAgent.indexOf('AppleWebKit/') == -1) document.write('<base href="' + location.protocol + '//' + location.host + location.pathname.replace(/\/[^\/]*$/, '/mobile/') + '"/>')</script>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.6">
<meta name="apple-mobile-web-app-capable" content="YES">
<link rel="apple-touch-icon" href="Images/WebClipIcon.png">
<link rel="stylesheet" href="main.css">
<script type="text/javascript" src="Parts/parts.js" charset="utf-8"></script>
<script type="text/javascript" src="main.js" charset="utf-8"></script>
<script type="text/javascript" src="mobile/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script language="javascript">
function slideSwitch() {
var $active = $('#slideshow IMG.active');
if ( $active.length == 0 ) $active = $('#slideshow IMG:last');
var $next = $active.next().length ? $active.next()
: $('#slideshow IMG:first');
$active.addClass('last-active');
$next.css({opacity: 0.0})
.addClass('active')
.animate({opacity: 1.0}, 1000, function() {
$active.removeClass('active last-active');
});
}
$(document).ready(function() {
setInterval( "slideSwitch()", 5000 );
});
</script>
</head>
<body onload="load();">
<div id="content">
<div id="top">
<img src="../Images/******TransparentBanner.png" style="height: 24px; z-index: 11; position: absolute; " id="banner">
<div id="slideshow">
<img src="../Images/******.png" class="active">
<img src="../Images/******.png">
<img src="../Images/******.png">
<img src="../Images/******.png">
<img src="../Images/******.jpg">
</div>
</div>
</div>
</body>
</html>
I masked some parts with asterisks because I don't want anyone who isn't involved in the project to know what the project is.
Re: Doing a jQuery slideshow - I get a ? mark
Not sure if it'll fix things, but some observations:
You've got two versions of jQuery; if both are being loaded successfully, then the latter overrides the former, and you're using jQuery 1.4.2 on your page (not 1.7.1). But, this error - "my browser was complaining that it could not find the variable $" - is indicative of the library not being loaded successfully. So I think perhaps that 1.7.1 was never being loaded, and when you added 1.4.2, the error resolved because it did load, and $ was now found.
Why 1.7.1 didn't load may be the result of your using the <base> tag. It affects any relative paths, so src="mobile/jquery-1.7.1.min.js" would be interpreted as "mobile/mobile/jquery-1.7.1.min.js". Too many "mobile"s?
As an aside (and I can see this was Jon Raasch's choice rather than yours), I personally wouldn't name my variables with $ - it's distracting when using libraries that designate special purpose to the character.
Re: Doing a jQuery slideshow - I get a ? mark
Run your page with Firefox - using Firebug - and look at the .Net tab - it will tell you what didn't load.
I'm guessing the ? mark is all about that fact.
Re: Doing a jQuery slideshow - I get a ? mark
Hard to say without seeing parts.js and main.js as well.
I can't see the load() function, for example. (And you shouldn't use onload anyway: it's poor practice.)
Re: Doing a jQuery slideshow - I get a ? mark
Quote:
Originally Posted by
SambaNeko
Not sure if it'll fix things, but some observations:
You've got two versions of jQuery; if both are being loaded successfully, then the latter overrides the former, and you're using jQuery 1.4.2 on your page (not 1.7.1). But, this error - "my browser was complaining that it could not find the variable $" - is indicative of the library not being loaded successfully. So I think perhaps that 1.7.1 was never being loaded, and when you added 1.4.2, the error resolved because it did load, and $ was now found.
Why 1.7.1 didn't load may be the result of your using the <base> tag. It affects any relative paths, so src="mobile/jquery-1.7.1.min.js" would be interpreted as "mobile/mobile/jquery-1.7.1.min.js". Too many "mobile"s?
As an aside (and I can see this was Jon Raasch's choice rather than yours), I personally wouldn't name my variables with $ - it's distracting when using libraries that designate special purpose to the character.
I just changed the code so that instead of pointing to 1.4.2 on Google's server it points to /mobile/jquery.min.js in the project folder. I think Jon Raasch should update his code so that it points to 1.7.1. It's more secure than 1.4.2 and is probably also backwards-compatible. And he should tell people to download jQuery right from jQuery.com instead of referring to the copy on Google's server, to reduce the load on their server.
Anyways, I think that question mark disappeared, even before I removed the reference to jQuery 1.4.2.
Re: Doing a jQuery slideshow - I get a ? mark
It is intentional to use GOOGLE server for the source of jQuery - it is highly recommended to use the minified versions that they host.
But for development you should be using a non-minified version so you can step into it with FireBug and find out what isn't working.
Do you use Firebug?
Re: Doing a jQuery slideshow - I get a ? mark
Quote:
Originally Posted by
szlamany
It is intentional to use GOOGLE server for the source of jQuery - it is highly recommended to use the minified versions that they host.
But for development you should be using a non-minified version so you can step into it with FireBug and find out what isn't working.
Do you use Firebug?
No. It's an iPhone thing I'm working on.