JS slide player ~~~~~~~~~~
VaR _ c = 0;
VaR _ I = 0;
VaR _ v = 0;
VaR _ L = 0;
VaR _ Sf = 3000;
VaR _ html = NULL;
VaR _ image = NULL;
VaR _ mycars = new array ();
VaR _ w = new array ();
VaR _ H = new array ();
Function adrotator (){}
Function adrotator. Add (p, W, H)
{
_ Mycars [_ c] = P;
_ W [_ c] = W;
_ H [_ c] = h;
_ C = _ c + 1;
}
/* Playback settings */
Function adrotator. Loads ()
{
If (_ I <_ mycars. Length & _ L <1)
{
_ Html = ''
If (_ v <1)
{
Document. getelementbyid ('image'). value = _ HTML + ',' + _ I;
Document. getelementbyid ('rotatorplayer'). innerhtml = _ HTML;
_ I = _ I + 1;
Document. getelementbyid ('backs'). Disabled = '';
Window. setTimeout ("adrotator. Loads (" + _ I + ")", _ SF );
}
}
Else
{
_ Html = ''
Document. getelementbyid ('image'). value = _ HTML + ',' + _ I;
Document. getelementbyid ('rotatorplayer'). innerhtml = _ HTML;
}
If (_ I + 1> _ mycars. length)
{
Document. getelementbyid ('stops '). Disabled = 'true ';
Document. getelementbyid ('play'). Disabled = '';
Document. getelementbyid ('backs'). Disabled = '';
Document. getelementbyid ('Next'). Disabled = 'true ';
_ I = 0;
_ V = 1;
}
}
/* Play */
Function adrotator. Play ()
{
_ V = 0;
_ L = 0;
Adrotator. Loads ();
}
/* Next */
Function adrotator. Next ()
{
_ L = 1;
If (_ I + 1 <_ mycars. length)
{
_ I = _ I + 1;
Document. getelementbyid ('play'). Disabled = '';
Document. getelementbyid ('stops '). Disabled = 'true ';
Document. getelementbyid ('backs'). Disabled = '';
Adrotator. Loads ();
}
Else
{
Document. getelementbyid ('Next'). Disabled = 'true ';
}
}
/* Previous */
Function adrotator. backs ()
{
_ L = 1;
If (_ I-1 <0)
{
Document. getelementbyid ('backs'). Disabled = 'true ';
}
Else
{
_ I = _ I-1;
Document. getelementbyid ('play'). Disabled = '';
Document. getelementbyid ('stops '). Disabled = 'true ';
Document. getelementbyid ('Next'). Disabled = '';
Adrotator. Loads ();
}
}
/* Interval */
Function adrotator. Set ()
{
VaR _ SFC = Document. getelementbyid ('second'). value;
If (isinteger (_ SFC ))
{
_ Sf = _ SFC x 1000;
}
Else
{
Alert ('prompt: only numbers can be entered! ');
Document. getelementbyid ('second'). value = 1;
Document. getelementbyid ('second'). Select ();
}
}
/* Character detection */
Function isinteger (STR)
{
VaR regu =/^ [-] {0, 1} [0-9] {1,} $ /;
Return regu. Test (STR );
}
/* Pause */
Function adrotator. Stops ()
{
_ V = 1;
}
/* Add an image, and pay attention to the image name. The size is 400,300 next to it.
*/
Adrotator. Add ("1.jpg", 400,300 );
Adrotator. Add ("2.jpg", 400,300 );
Adrotator. Add ("3.jpg", 400,300 );
Save the above file as a JS File
Reference it in the following file.
<Style type = "text/CSS">
<! --
Body {font-size: 12px;
}
Input {
Border-Right: # 7b9ebd 1px solid;
Padding-Right: 2px;
Border-top: # 7b9ebd 1px solid;
Padding-left: 2px;
Font-size: 12px;
Filter: progid: DXImageTransform. Microsoft. gradient (gradienttype = 0, startcolorstr = # ffffff, endcolorstr = # cecfde );
Border-left: # 7b9ebd 1px solid;
Cursor: hand;
Color: black;
Padding-top: 2px;
Border-bottom: # 7b9ebd 1px solid;
}
Button {
Border-Right: # 7b9ebd 1px solid;
Padding-Right: 2px;
Border-top: # 7b9ebd 1px solid;
Padding-left: 2px;
Font-size: 12px;
Filter: progid: DXImageTransform. Microsoft. gradient (gradienttype = 0, startcolorstr = # ffffff, endcolorstr = # cecfde );
Border-left: # 7b9ebd 1px solid;
Cursor: hand;
Color: black;
Padding-top: 2px;
Border-bottom: # 7b9ebd 1px solid;
}
-->
</Style>
<Script language = "JavaScript" src = "test. js">
</SCRIPT>
<Body>
<Div id = "rotatorplayer"> </div>
<Input type = "button" name = "play" value = "start playing" Disabled = "true"/>
<Input type = "button" name = "stops" value = "Suspend"/>
<Input type = "button" name = "backs" value = "previous" Disabled = "true"/>
<Input type = "button" name = "Next" value = "Next"/>
<Input type = "text" id = "second" value = "3" size = "3" maxlength = "2">
Seconds
<Input type = "button" value = "Set Time"/>
<Input name = "image" type = "text" size = "65"/>
A very good player. Unfortunately, if the picture is very big, the result would be a little miserable.
Link: http://www.cnblogs.com/koolay/articles/984852.html