Welcome to WebmasterWorld Guest from 54.159.111.156

Forum Moderators: open

Message Too Old, No Replies

Opera question

JS script not working...

     

GWJ

5:35 pm on Jul 31, 2001 (gmt 0)



Hello,

I hate to ask but I am clueless on this. I have a page called indexnew.asp (You may get the domain from my profile. The page is still VERY rough on SEO but). I have a slide show script that rotates two sets of images at the top portion of the white part of the page. It works in NN 4.X and up. It works in I.E. 4.X and up. Come to find out when I tested with Opera I missed this not working.

I am calling an external JS file from the top of the page. I use a body load statement also. I then place the code in the spot I want it to happen, so I have three areas that effect the script. In Opera it shows the static image but does not rotate the images that is called in the JS script.

I'm confused as to what needs modified. This is what I have...

Call from page:

<SCRIPT LANGUAGE="JavaScript" src="http://www.goldenwebjewelers.com/js/SS1.js">

</Script>

External JS file:

/* file name: ss1.js */
<!-- Begin

var slideShow1Speed = 4000;

var crossFadeDuration = 4;

var Pic = new Array();

Pic[0] = 'images/products/thumb/wring011.jpg'
Pic[1] = 'images/products/thumb/wring029.jpg'
Pic= 'images/products/thumb/wring026.jpg'
Pic[3] = 'images/products/thumb/wring046.jpg'

// do not edit anything below this line
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow1() {
if (document.all) {
document.images.SlideShow1.style.filter="blendTrans(duration=2)";
document.images.SlideShow1.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow1.filters.blendTrans.Apply();
}
document.images.SlideShow1.src =preLoad[j].src;
if (document.all) {
document.images.SlideShow1.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow1()', slideShow1Speed);
}
// End -->

Pages body statement:

<body onLoad="runSlideShow1()"

Page TD:

<td valign="middle" align="center"><img src="images/products/thumb/wring009.jpg" name="SlideShow1" width=75 height=75></td>

Does anyone see anything that would cause Opera not to recognize this and run?

Sorry for the specific question and thank you for the help,

Brian

([2]edited by: tedster at 11:01 am (gmt) on Aug. 2, 2001

6:42 pm on Jul 31, 2001 (gmt 0)

10+ Year Member



It works for me - using Opera 5.12
<added>
Noticed that when identified as MSIE 5 it doesn't work. Opera, and all Mozilla id's are OK though.
</added>
7:40 pm on Jul 31, 2001 (gmt 0)

10+ Year Member



What page should I be on to see the slide show?

I could not see where the SSi.js file was loaded. I do see the navigate.js loaded twice both with IE 5.5 and Opera. But I was up late last night and the vision is a little week today.

7:57 pm on Jul 31, 2001 (gmt 0)

10+ Year Member



www.goldenwebjewelers.com/indexnew.asp

(edited by: Xoc at 11:36 pm (gmt) on July 31, 2001

9:34 pm on Jul 31, 2001 (gmt 0)

10+ Year Member



Not wishing to be critical GWJ, but I think the Seo being a little rough is less important than the very long download time that the page takes. The stats speak for themselves about entry pages with hefty download times.
10:01 pm on Jul 31, 2001 (gmt 0)

10+ Year Member



The problem is that the filters array is only valid with IE. What you have run into is one of the difficulties in scripting for Opera. Alot of scripts use the document.all test to test for IE. When Opera is in MSIE mode it passes the test and fails at the function.

Do you need the IE specific part of the function, another words get rid of the document.all stuff. I think IE will run the function (can't be sure with out testing).

The only other suggestion would be to test for another object maybe the filters array directly(Opera might choke on it also)

Sorry I can't be of more help, maybe someone else can give you a replacement test.
David

10:26 pm on Jul 31, 2001 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



You could try removing the HTML comment tags in the SS1.js and SS2.js external files. Things like <!-- Begin and End --> are HTML comments, and are not needed in a .js file. Might be mucking up the works.

By the way, I get the same incompatibility others report -- only on Opera when it's identified as IE5.

10:38 pm on Jul 31, 2001 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Whoops -- overlapping post times.

You're right, David. Those IE specific transition blends look really nice, but they are the problem. I'm looking around for another test - it would be useful in many situations.

GWJ

4:10 am on Aug 1, 2001 (gmt 0)



Hi,

Thanks all, it is a late night at the "real job" been in 14 hours and looks like a few more. If I come off "punchy", my apoligies (sure many of you have been there).

Thanks for the great responses David and Tedster I will look at when sleep is back on track. I will rip out the comment tags I use them a lot in the external JS files but really don't need them anymore, that's the easy part ;).

>>>very long download time that the page takes.

Fixit,

I am confused. I just ran @ net mechanic a download time demo and it checks in around 14.02 seconds for a 14.4 modem and 8.01 seconds on a 28.8 modem.

I then checked out the "Webpage size checker" @ S.E.W. and it checked in at 54866 bytes which I thought was OK.

Brian

5:53 am on Aug 2, 2001 (gmt 0)

10+ Year Member



Hi,

Use /* ... */ for comments in an external css file.

Always test for opera first. Here's something I use:

function ClientSnifferJr()
{
  this.ua = navigator.userAgent.toLowerCase();
  this.major = parseInt(navigator.appVersion);
  this.minor = parseFloat(navigator.appVersion);
  // DOM Support
  if (document.addEventListener && document.removeEventListener) this.dom2events = true;
  if (document.getElementById) this.dom1getbyid = true;
  // Opera
  this.opera = this.ua.indexOf('opera') != -1;
  if (this.opera) {
    this.opera5 = (this.ua.indexOf("opera 5") != -1 ¦¦ this.ua.indexOf("opera/5") != -1);
    return;
  }
  // MSIE
  this.ie = this.ua.indexOf('msie') != -1;
  if (this.ie) {
    this.ie3 = this.major < 4;
    this.ie4 = (this.major == 4 && this.ua.indexOf('msie 5') == -1 && this.ua.indexOf('msie 6') == -1);
    this.ie4up = this.major >= 4;
    this.ie5 = (this.major == 4 && this.ua.indexOf('msie 5.0') != -1);
    this.ie5up = !this.ie3 && !this.ie4;
    this.ie6 = (this.major == 4 && this.ua.indexOf('msie 6.0') != -1);
    this.ie6up = (!this.ie3 && !this.ie4 && !this.ie5 && this.ua.indexOf("msie 5.5") == -1);
    return;
  }
  // Misc.
  this.hotjava = this.ua.indexOf('hotjava') != -1;
  this.webtv = this.ua.indexOf('webtv') != -1;
  this.aol = this.ua.indexOf('aol') != -1;
  if (this.hotjava ¦¦ this.webtv ¦¦ this.aol) return;
  // Gecko, NN4+, and NS6
  this.gecko = this.ua.indexOf('gecko') != -1;
  this.nav = (this.ua.indexOf('mozilla') != -1 && this.ua.indexOf('spoofer') == -1 && this.ua.indexOf('compatible') == -1);
  if (this.nav) {
    this.nav4 = this.major == 4;
    this.nav4up= this.major >= 4;
    this.nav5up= this.major >= 5;
    this.nav6 = this.major == 5;
    this.nav6up= this.nav5up;
  }
}

window.is = new ClientSnifferJr();

10:56 am on Aug 2, 2001 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Also, Mozilla.org has what they call "The Ultimate Client Sniffer [mozilla.org]". It invariably detects Opera, even when it's set to spoof.

Mike, your sniffer is good as well, especially since most people probably won't want the full-blown Mozilla.org one.

> I then checked out the "Webpage size checker" @ S.E.W. and it checked in at 54866 bytes which I thought was OK. <

The thing is, Brian, you're loading a lot of files with javascript for the slide show. Most size checkers miss that. When I went to the page with Opera, it reported 187kb in the status bar before the entire page was done.

GWJ

11:33 am on Aug 2, 2001 (gmt 0)



Ahha, thank you Tedster, as always. I did not realize that.

I guess that raises a question in my mind. On the slide show I assumed it only downloaded the images when the script made a call to each image, I am guessing from your post I am wrong (still learning JS and how it works)? In my mind I thought it would not hold up the initial page load?

I did think ahead enough to where each slide show only uses four images each. On sub pages I use the slide show and keep the same images so they are not forced to download more graphics. It is a nice bells/whistle but if this is the case I can loose it on the index page.

(Slapping head sound) Doah! 187kb violated my first rule ;).

Brian

11:50 am on Aug 2, 2001 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



FYI, Brian, the external script loads the images here, right after the "do not edit" warning:

var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}

GWJ

1:51 pm on Aug 2, 2001 (gmt 0)



Thanks, yet again Tedster. I need to open my eyes more before posting. Sorry about that.

I, when I get home, will try dropping the preload portion

var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}

to see if the script will still function. If it does then my page would be back down to an inital 54866 bytes (being the size without the image calls in the JS script). Then calling each image to download as the script rotates through the image calls.

I am only on chapter three of the JS book that I picked up but it is starting to make sense :).

Thanks for all the specific help. It never amazes me how much knowledge are on these boards.

Brian

GWJ

3:15 pm on Aug 7, 2001 (gmt 0)



Hi,

Just a followup. I ended up dropping the transition effects for I.E. and that got Opera working. I tried playing with the object document.all on the transition line for a while but just did not have any luck, so I dumped that portion.

On the preloading, I guess it needs to stay. In concern for the page weight I will optimize the images better. I did a fast test and got the first image's size cut in 1/2. I will also go from two slide shows calling four images each to two slide shows calling two possible three images each.

One question in my mind on the preloading. Once the script runs the first time on the intial page. When using the same script on sub pages. The images are allready cached and the JS won't make it dowload again or will it?

Thanks to evryone who helped I do greatly appreciate it.

Brian

9:23 am on Aug 9, 2001 (gmt 0)

10+ Year Member



In general, browser-sniffing is a very fragile and error-prone practice. You never know when a new browser release might force you to go back and update all your pages.

If you're going to use browser-specific objects, sniff for the objects you use rather than the browser versions that currently support those objects. It's a subtle enough distinction to cause confusion, but object-sniffing and browser-sniffing with objects are two different things. Even object sniffing doesn't completely solve the problem though, since you can still get bitten by bugs or implementations of a given object that are simply different.

10:04 am on Aug 9, 2001 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



GWJ:
When using the same script on sub pages. The images are allready cached and the JS won't make it dowload again or will it?

The images will be in the cache — no further downloads if you re-use the slide show on another page.

gmiller:
...object-sniffing and browser-sniffing with objects are two different things.

I've been sniffing for document.layers and assuming that will always return true for Netscape 4.x and never any other browser. Is this actually the case? It seems to come in handy for dealing with CSS oddities in Netscape 4.x, but now I'm wondering how secure my logic is.

GWJ

12:39 pm on Aug 9, 2001 (gmt 0)



Thanks Gmiller. Thanks Tedster, I assumed that but you know about assuming ;).

Brian

1:46 am on Aug 10, 2001 (gmt 0)

10+ Year Member



tedster: I don't really know. I don't know of any browsers that do anything with document.layers other than NN4, but I could easily miss something like that in one of the less common browsers. I'm more concerned about future browser releases making an attempt to provide NN4 compatibility, since there are still people demanding that NS6/Mozilla do exactly that.

document.all on Opera is the most frequent source of failures so far. Reading the articles on WebReference about HierMenus is pretty educational about what browsers implement what features. That may well be the shakiest piece of code ever released on the web :)

5:07 pm on Aug 28, 2001 (gmt 0)

WebmasterWorld Administrator brett_tabke is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



>I've been sniffing for document.layers and assuming
>that will always return true for Netscape 4.x and
>never any other browser. Is this actually the case?

Opera's js "sniff" logic:

- js specifies "Opera" (it always runs that code regardless of agent spoof mode)
- js specifies "Netscape" and Opera in Netscape spoof mode. It runs that code. Thus, layers can fail because Opera doesn't suppor them.
- js specifies "IE" and Opera in IE spoof mode - runs that code.

 

Featured Threads

Hot Threads This Week

Hot Threads This Month