First describe the background of this bizarre bug:
I load a bunch of small thumbnails when the page loads, <a href= "javascript:void (0)," onclick= "switch_image (' 1.jpg ')" ></a>
So many small thumbnails of the label loop are tiled down, when the small picture is clicked, dynamic loading large picture display, similar to Taobao merchandise view picture. There is a label on the page:
<div id= "Pic-box" ></div>"
In order to save traffic, speed up the page load speed, first do not load large images, when the user clicks the small figure, dynamic load a large picture display.
Copy Code code as follows:
<script>
function Switch_image (IM)
{
document.getElementById (' Big-image '). Src=im;
}
</script>
This way all browsers outside ie6,7 are working properly, such as Ie8,firefox, Opera, Chrome, Safari ...
Is ie6,7 these two browsers can not load, click the small picture, sometimes you load, sometimes loaded half, sometimes can not load.
I think the problem is in the src this thing, it is possible ie6,7 modified SRC can not load the picture correctly, and then try to change the switch function to:
document.getElementById (' Pic-box '). innerhtml= ' ';
ie6,7 or not, so think, there may be a picture is cached, then plus random number:
document.getElementById (' Pic-box '). innerhtml= ' ';
ie6,7 still can't.
So think, may be img used in the innerHTML inside the problem, so, change to use AppendChild
var img = document.createelement (' img ');
Img.src= im;
document.getElementById (' Pic-box '). AppendChild (IMG);
It's still not working.
And then modified to use new image to:
var img = new Image ();
Img.src= im;
document.getElementById (' Pic-box '). AppendChild (IMG);
It's still not working.
Baffled, think, can't ie6,7 dynamically load pictures? Is it an IMG tag problem?
So if you change it to a background map, load it, so
document.getElementById (' Pic-box '). style.background= "url (" + im + ");
ie6,7 still not, the above so many methods except ie6,7 are normal.
Only Google, the result of Google:
ie6,7 only in the <a onclick= "Switch_image ()" href= "javascript:void (0);" ></a> so
Dynamic loading of the picture is only the case, Google to a note:
There are a few full of things to do the foreigner repeated trial found that the problem is a IE6 in the underlying mechanism of the bug, after the version has been resolved.
It is said that <a href= "javascript:void (0)" > or <a href=# "> Such use of a label will not prevent the end of a tag to trigger a behavior,
Cause IE6 will mistakenly think that the page is refreshed or redirected, and that all current connections are interrupted, so that the load of the new picture is aborted.
Of course, these are full of nothing to do the foreigners also put forward a variety of inconceivable complex incomparable solution.
The simplest method has two, one is this use of a label <a href= "Switch_image (); return false; The other is to use DIV to replace a tag.
In fact, I found that not only is ie6,ie7 also have this bug, also, use: <a href= "switch_image (); return false; > does not solve the problem.
So it is recommended to replace a tag with another tag, and finally rage replace all a tags with span, and never again.
