slow preload for IE

[jmhill]

Has anyone else had this issue? Basically, the preload of images for a
rollover effect for the navigation is really really slow when using IE
6.0 but when i view the site using Netscape, it's fast like it should
be(no lag!)

My problem is that since 96% of users use IE, i need to figure a way
to fix this. Below is the javascript currently being used. The
arguments are passed in before the script is called.

MM_preloadImage s(
'<%=assets_path %>/left_nav/manage_view_wth r_on.gif',
'<%=assets_path %>/left_nav/manage_admin_gu ide_on.gif',
'<%=assets_path %>/left_nav/manage_terms_co nd_on.gif',
'<%=assets_path %>/left_nav/manage_reports_ on.gif',
'<%=assets_path %>/left_nav/manage_account_ info_on.gif',
)
function gn_rollover_pre load(){
//preloads middle images for the navigation
if (document.image s){
var argLength = gn_rollover_pre load.arguments. length;

for (arg=0; arg < argLength; arg++){
eval(arguments[arg] + "_off = new Image()");
eval(arguments[arg] + "_on = new Image()");
eval(arguments[arg] + "_left = new Image()");
eval(arguments[arg] + "_right = new Image()");

eval(arguments[arg] + "_off.src = '" + ASSET_PATH_HEAD ER +
"button_nav _"+ arguments[arg] + "_off.gif'" );
eval(arguments[arg] + "_on.src = '" + ASSET_PATH_HEAD ER +
"button_nav _"+ arguments[arg] + "_on.gif'") ;
eval(arguments[arg] + "_left.src = '" + ASSET_PATH_HEAD ER +
"button_nav _"+ arguments[arg] + "_left.gif' ");
eval(arguments[arg] + "_right.src = '" + ASSET_PATH_HEAD ER +
"button_nav _"+ arguments[arg] + "_right.gif '");
}

// Now Preload all "corner" images for faster swapping
corner1 = new Image();
corner2 = new Image();
corner2_both = new Image();
corner3 = new Image();
corner3_both = new Image();
corner4 = new Image();
corner4_both = new Image();
corner5 = new Image();

corner1.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner_1.gif'");
corner2.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner_2.gif'");
corner2_both.sr c = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner2_both.gif'" );
corner3.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner_1.gif'");
corner3_both.sr c = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner3_both.gif'" );
corner4.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner_1.gif'");
corner4_both.sr c = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner4_both.gif'" );
corner5.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_cor ner_2.gif'");

}
}

[Steve van Dongen]

Ju*********@gra duates.iti.com (jmhill) wrote:

Has anyone else had this issue? Basically, the preload of images for a
rollover effect for the navigation is really really slow when using IE
6.0 but when i view the site using Netscape, it's fast like it should
be(no lag!)

My problem is that since 96% of users use IE, i need to figure a way
to fix this. Below is the javascript currently being used. The
arguments are passed in before the script is called.

MM_preloadImag es(
'<%=assets_pat h%>/left_nav/manage_view_wth r_on.gif',
'<%=assets_pat h%>/left_nav/manage_admin_gu ide_on.gif',
'<%=assets_pat h%>/left_nav/manage_terms_co nd_on.gif',
'<%=assets_pat h%>/left_nav/manage_reports_ on.gif',
'<%=assets_pat h%>/left_nav/manage_account_ info_on.gif',
)
function gn_rollover_pre load(){
//preloads middle images for the navigation
if (document.image s){
var argLength = gn_rollover_pre load.arguments. length;

for (arg=0; arg < argLength; arg++){
eval(arguments[arg] + "_off = new Image()");
eval(arguments[arg] + "_on = new Image()");
eval(arguments[arg] + "_left = new Image()");
eval(arguments[arg] + "_right = new Image()");

eval(arguments[arg] + "_off.src = '" + ASSET_PATH_HEAD ER +
"button_nav_ "+ arguments[arg] + "_off.gif'" );
eval(arguments[arg] + "_on.src = '" + ASSET_PATH_HEAD ER +
"button_nav_ "+ arguments[arg] + "_on.gif'") ;
eval(arguments[arg] + "_left.src = '" + ASSET_PATH_HEAD ER +
"button_nav_ "+ arguments[arg] + "_left.gif' ");
eval(arguments[arg] + "_right.src = '" + ASSET_PATH_HEAD ER +
"button_nav_ "+ arguments[arg] + "_right.gif '");
}
Don't use eval. It's slow an error prone. I've seen only 2 cases
where eval was required and everything else can be written better a
different way.

var preloadedImgs = new Object();
for (arg=0; arg < argLength; arg++)
{
preloadedImgs[arguments[arg] + "_off"] = new Image()";
preloadedImgs[arguments[arg] + "_on"] = new Image()";
preloadedImgs[arguments[arg] + "_left"] = new Image()";
preloadedImgs[arguments[arg] + "_right"] = new Image()";

preloadedImgs[arguments[arg] + "_off"].src = ASSET_PATH_HEAD ER
+
"button_nav _"+ arguments[arg] + "_off.gif";
preloadedImgs[arguments[arg] + "_on"].src = ASSET_PATH_HEAD ER
+
"button_nav _"+ arguments[arg] + "_on.gif";
preloadedImgs[arguments[arg] + "_left"].src =
ASSET_PATH_HEAD ER +
"button_nav _"+ arguments[arg] + "_left.gif" ;
preloadedImgs[arguments[arg] + "_right"].src =
ASSET_PATH_HEAD ER +
"button_nav _"+ arguments[arg] + "_right.gif ";
}

// Now Preload all "corner" images for faster swapping
corner1 = new Image();
corner2 = new Image();
corner2_both = new Image();
corner3 = new Image();
corner3_both = new Image();
corner4 = new Image();
corner4_both = new Image();
corner5 = new Image();

corner1.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner_1.gif'");
corner2.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner_2.gif'");
corner2_both.sr c = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner2_both.gif' ");
corner3.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner_1.gif'");
corner3_both.sr c = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner3_both.gif' ");
corner4.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner_1.gif'");
corner4_both.sr c = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner4_both.gif' ");
corner5.src = eval("'" + ASSET_PATH_HEAD ER +
"button_nav_co rner_2.gif'");

Get rid of eval. It does absolutely nothing here but slow you down.
http://msdn.microsoft.com/library/en...6jsmtheval.asp

Regards,
Steve

[Justin Hill]

Thanks for the input Steve. After doing a little deeper digging I'm
guessing that the problem is a little deeper than the preload. Since the
lag time appears on the rollover effects of the images, it appears the
javascript functions for the onMouseOver and onMouseOut may be to blame.
Take a look at these functions and let me know if anything seems wierd
that might cause the lag in IE but not Netscape.

Thanks

onMouseOver="MM _swapImage('Ima ge2','','/left_nav/manage_view_sta te_on.gi
f',0)" >

function MM_swapImage() {
var i,j=0,x,a=MM_sw apImage.argumen ts;
document.MM_sr= new Array;
for(i=0;i<(a.le ngth-2);i+=3){
if ((x=MM_findObj( a[i]))!=null){
document.MM_sr[j++]=x;
if(!x.oSrc){
x.oSrc=x.src;
}
x.src=a[i+2];
}
}
}

onMouseOut="MM_ swapImgRestore( )"

function MM_swapImgResto re() {
var i,x,a=document. MM_sr;
for(i=0;a&&i< a.length&&(x=a[i])&&x.oSrc;i++ ){
x.src=x.oSrc;
}
}

And if that wasn't enough, here's the real preload that gets called:

function MM_preloadImage s() {
var d=document;
if(d.images){
if(!d.MM_p){
d.MM_p=new Array();
}
var i,j=d.MM_p.leng th,a=MM_preload Images.argument s;
for(i=0; i< a.length; i++){
if (a[i].indexOf("#")!= 0){
d.MM_p[j]=new Image;
d.MM_p[j++].src=a[i];
}
}
}
}

Thanks for any help

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!