:
Errors in the Code. Please correct them.
Copy codeThe Code is as follows:
/**
* @ Author leepood
* @ Title: automatic rotation of images
* @ Version v2.0
* @ E-mail leepood@gmail.com
* @ Notice: You can adjust the number of images to be displayed in setting, but you need to add the corresponding image parameters to imagesArray.
*/
Function changeImages ()
{
Var setting = {
'Width': '330px ',
'Height': '200px ',
'Images _ count': '4 ',
'Time': '000000', // The image switching speed.
'Imageschange _ border_color ':' # fcf0a1'
};
Var imagesArray = [{'src': 'images/1.bmp ', 'href': 'http: // www.baidu.com/', 'title':'autumn, a golden ', 'target':'_blank '},
{'Src': 'images/2.bmp ', 'href': 'http: // www.163.com ', 'title': 'spring, giving people a sense of life ', 'target': '_ blank '},
{'Src': 'images/3.bmp ', 'href': 'http: // iagyje.blog.163.com ', 'title': 'longan is the best, I eat a lot each time ', 'target': '_ blank '},
{'Src': 'images/4.bmp ', 'href': 'http: // www.sina.com/', 'title':'. You can check the ','target':'_blank'parameter.
// Add elements and define variables
Var $ div_imageschange = $ ("# imageschange ");
Nvidiv_imageschange.children().css ("margin", "0px" ).css ("padding", "0px ");
$ Div_imageschange.append ("<div id = 'images _ click'> </div> ");
$ Div_imageschange.append ("<div id = 'images _ title'> </div> ");
Var $ div_images_title = $ ("# images_title ");
Var $ div_images_button = $ ("# images_button ");
Var count = setting. images_count;
For (var a = 0; a <count; a ++)
{
Var B = a + 1;
$ Div_images_button.append ("<a id = '" + B + "'>" + B + "</a> ");
}
Var $ link_buttons = $ ("# imageschange ");
// Set the initial attributes of an element
// The outermost layer container, containing all elements
$Div_imageschange.css ("width", setting. width)
. Css ("position", "relative ")
. Css ("height", setting. height)
. Css ("border", "solid 1px" + setting. imageschange_border_color );
// Contains the button Elements
$Div_images_button.css ("position", "absolute ")
. Css ("height", "20px ")
. Css ("right", "0px ")
. Css ("bottom", "21px ")
. Css ("opacity", "1 ")
. Css ("float", "right ");
// Contains text description elements
$Div_images_title.css ("position", "absolute ")
. Css ("height", "20px ")
. Css ("width", setting. width)
. Css ("bottom", "0px ")
. Css ("right", "0px ")
. Css ("background-color", "black ")
. Css ("opacity", "0.6 ")
. Css ("font-size", "12px ")
. Css ("color", "white ");
// Button combination
$Link_buttons.css ("width", "15px ")
. Css ("height", "15px ")
. Css ("border", "solid 1px # fcf0a1 ")
. Css ("display", "block ")
. Css ("margin", "0 5px 5px 5px ")
. Css ("font-size", "12px ")
. Css ("text-align", "center ")
. Css ("float", "left ")
. Css ("color", "white ")
. Css ("text-decoration", "none ");
// Initialization settings
$Div_imageschange.css ("background-image", "url ('images/1.bmp ')");
Required div_images_title.html (imagesArray [0]. title );
$ ("# Images_button a: first" ).css ("background", "# fcf0a1 ");
Function change (index ){
$Div_imageschange.css ("background-image", "none ");
$Div_imageschange.css ("background-image", "url ('" + imagesArray [index]. src + "')");
Includiv_images_title.html ("");
Required div_images_title.html (imagesArray [index]. title );
$ ($ Link_buttons [index]). attr ("href", imagesArray [index]. href). attr ("target", imagesarray?index=.tar get );
$Link_buttons.css ("background ","");
(($Link_buttons?index=}.css ("background", "# fcf0a1 ");
};
// Automatically switch code
Function autochange (){
Var I = 0;
SetInterval (function (){
Change (I );
If (I = setting. images_count-1)
{
I =-1;
}
I ++;
}, Setting. time );
}
Autochange ();
// Manually switch the code
$ Link_buttons.each (function (I ){
$ (This). hover (function (){
Change (I );
});
});
};
$ (Document). ready (function (){
ChangeImages ();
});
You can adjust the number of images to be displayed in setting, but you need to add the corresponding image parameters to imagesArray.