"JavaScript" leverages file fragment DocumentFragment to improve compatible IE6 adjustable and controllable picture sliders

The last time in the "JavaScript" compatible IE6 adjustable controllable picture slider (click Open link) algorithm is not very good, if you want to do n pictures of the picture slider, each time the x picture, you want to load X-1 pictures at once, but also with a display box to move the way to achieve. What is even more frightening is that it should be taken for granted. Although this contrary to the ordinary way of thinking in the Internet widely circulated, and seems to be the same formula, there is only one way to achieve, in fact, it is not, obviously can use the file fragment DocumentFragment to achieve the picture slider, if you want to n pictures of the picture slider, loading n pictures, this is normal. Key to the use of file fragments, the implementation of 200000 pictures of the picture slider is no problem. The method before writing is stretched out.

I. BASIC OBJECTIVES

Or the same as the last time, but the implementation of the same way as the last time, specific than the two articles read

Second, the basic idea

The last time to load N pictures, using the display slider to achieve, but this time to use the following way:

That's the way I thought it would be impossible to kill. Four image sliders as an array, the slider to the left moves the first element of the array to the end, and the slider to the right moves the last element of the array to the head.

Third, the production process

1, the HTML layout or the above layout, the picture is that several from the WinXP system pulled from the poor picture, a word did not change, the specific following, no longer repeat.

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">2, after the implementation of the JavaScript part is the focus of implementation, where the flexible use of "JavaScript" using getElementsByTagName and Getelementsbyname to improve the original eco-compatible IE6 label page (Click the Open link) to group the nodes in the same way as the JavaScript for array operation function unshift (), Shift (), pop (), push (), file fragment is a node in memory, and the operation of the node "JavaScript" Web node additions and deletions (click to open the link) there is no difference, as follows:
<script>//page load will call this function, the parameter 1 means to scroll to the right, notice the function of the HTML button call you know Pic_marquee_move (1);//2S to the right to change the SetInterval ("Pic_ Marquee_move (1) "," function Pic_marquee_move (leftorright) {//Gets all div nodes under Picmarquee, forming an array var divarr= document.getElementById ("Picmarquee"). getElementsByTagName ("div");//Just such a "reference array" cannot be manipulated directly, You must create a new real array to store all of this in Var tempsoftarr=new array (); for (Var i=0;i<divarr.length;i++) {tempsoftarr[i]=divarr[i];} If you move left if (leftorright==0) {///Then delete the first element of the array and save the element through the variable var firstpic=tempsoftarr.shift ();//After putting this element in the last position of the array, Also equivalent to inserting into array tempsoftarr[tempsoftarr.length]=firstpic;} else{//If you move to the right, put the last element into the head of the array Tempsoftarr.unshift (Tempsoftarr.pop ());} Create a new file fragment, the file fragment is a temporary folder, you first put this node into a real web page, do not have to get a node to refresh a webpage, frag=document.createdocumentfragment var (); for (Var i=0;i<tempsoftarr.length;i++) {frag.appendchild (tempsoftarr[i]);} The file fragment is a replacement insert, and the original ID of the Picmarquee node is replaced by the file fragment node document.getElementById ("Picmarquee"). AppendChild (Frag); </script>

At this point, the entire drawing slider is done.
"JavaScript" leverages file fragment DocumentFragment to improve compatible IE6 adjustable and controllable picture sliders