469,889 Members | 1,257 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,889 developers. It's quick & easy.

slow preload for IE

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_preloadImages(
'<%=assets_path%>/left_nav/manage_view_wthr_on.gif',
'<%=assets_path%>/left_nav/manage_admin_guide_on.gif',
'<%=assets_path%>/left_nav/manage_terms_cond_on.gif',
'<%=assets_path%>/left_nav/manage_reports_on.gif',
'<%=assets_path%>/left_nav/manage_account_info_on.gif',
)
function gn_rollover_preload(){
//preloads middle images for the navigation
if (document.images){
var argLength = gn_rollover_preload.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_HEADER +
"button_nav_"+ arguments[arg] + "_off.gif'");
eval(arguments[arg] + "_on.src = '" + ASSET_PATH_HEADER +
"button_nav_"+ arguments[arg] + "_on.gif'");
eval(arguments[arg] + "_left.src = '" + ASSET_PATH_HEADER +
"button_nav_"+ arguments[arg] + "_left.gif'");
eval(arguments[arg] + "_right.src = '" + ASSET_PATH_HEADER +
"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_HEADER +
"button_nav_corner_1.gif'");
corner2.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_2.gif'");
corner2_both.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner2_both.gif'");
corner3.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_1.gif'");
corner3_both.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner3_both.gif'");
corner4.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_1.gif'");
corner4_both.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner4_both.gif'");
corner5.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_2.gif'");

}
}
Jul 20 '05 #1
2 2791
Ju*********@graduates.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_preloadImages(
'<%=assets_path%>/left_nav/manage_view_wthr_on.gif',
'<%=assets_path%>/left_nav/manage_admin_guide_on.gif',
'<%=assets_path%>/left_nav/manage_terms_cond_on.gif',
'<%=assets_path%>/left_nav/manage_reports_on.gif',
'<%=assets_path%>/left_nav/manage_account_info_on.gif',
)
function gn_rollover_preload(){
//preloads middle images for the navigation
if (document.images){
var argLength = gn_rollover_preload.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_HEADER +
"button_nav_"+ arguments[arg] + "_off.gif'");
eval(arguments[arg] + "_on.src = '" + ASSET_PATH_HEADER +
"button_nav_"+ arguments[arg] + "_on.gif'");
eval(arguments[arg] + "_left.src = '" + ASSET_PATH_HEADER +
"button_nav_"+ arguments[arg] + "_left.gif'");
eval(arguments[arg] + "_right.src = '" + ASSET_PATH_HEADER +
"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_HEADER
+
"button_nav_"+ arguments[arg] + "_off.gif";
preloadedImgs[arguments[arg] + "_on"].src = ASSET_PATH_HEADER
+
"button_nav_"+ arguments[arg] + "_on.gif";
preloadedImgs[arguments[arg] + "_left"].src =
ASSET_PATH_HEADER +
"button_nav_"+ arguments[arg] + "_left.gif";
preloadedImgs[arguments[arg] + "_right"].src =
ASSET_PATH_HEADER +
"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_HEADER +
"button_nav_corner_1.gif'");
corner2.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_2.gif'");
corner2_both.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner2_both.gif'");
corner3.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_1.gif'");
corner3_both.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner3_both.gif'");
corner4.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_1.gif'");
corner4_both.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner4_both.gif'");
corner5.src = eval("'" + ASSET_PATH_HEADER +
"button_nav_corner_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
Jul 20 '05 #2

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('Image2','','/left_nav/manage_view_state_on.gi
f',0)" >

function MM_swapImage() {
var i,j=0,x,a=MM_swapImage.arguments;
document.MM_sr=new Array;
for(i=0;i<(a.length-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_swapImgRestore() {
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_preloadImages() {
var d=document;
if(d.images){
if(!d.MM_p){
d.MM_p=new Array();
}
var i,j=d.MM_p.length,a=MM_preloadImages.arguments;
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!
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Tole | last post: by
7 posts views Thread by MALdito | last post: by
3 posts views Thread by Max Biancofiore | last post: by
2 posts views Thread by Albert Spencil | last post: by
4 posts views Thread by Adrian MacNair | last post: by
4 posts views Thread by Scott Johnson | last post: by
4 posts views Thread by rubyhcurry | last post: by
1 post views Thread by shapper | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.