特效描述：利用jquery实现 绚丽绽放 焦点广告效果，利用jquery实现绚丽绽放焦点广告效果

代码结构

1. 引入CSS

<link rel="stylesheet" type="text/css" href="style/style.css" media="all" />

<link rel="stylesheet" type="text/css" media="screen" href="style/default.css">

<link rel="stylesheet" type="text/css" href="style/home.css">

<link rel="stylesheet" type="text/css" href="style/styles_ie.css" />

<link rel="stylesheet" type="text/css" href="style/style.css" media="all" />

<link rel="stylesheet" type="text/css" media="screen" href="style/default.css">

<link rel="stylesheet" type="text/css" href="style/home.css">

<link rel="stylesheet" type="text/css" href="style/styles_ie.css" />

2. 引入JS

<script type="text/javascript" language="javascript" src="script/jquery-1.4.2.min.js" ></script>

<script type="text/javascript" language="javascript" src="script/jquery.easing.1.3.js"></script>

<script type="text/javascript" language="javascript" src="script/home.js"></script>

<script type="text/javascript" language="javascript" src="script/jquery-1.4.2.min.js" ></script>

<script type="text/javascript" language="javascript" src="script/jquery.easing.1.3.js"></script>

<script type="text/javascript" language="javascript" src="script/home.js"></script>

3. HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<!–[if lte IE 7]>

<![endif]–>

</head>

<body onload="load_animations()">

<!– slider –>

<div class="container_12">

<div class="slider">

<div id="header_images" style="height: 468px; opacity: 1; ">

<img src="images/slider1_image_2.jpg" class="header_image" color="#054065" alt="" link="###" target="_self" style="opacity: 1; ">

<img src="images/slider1_image_1.jpg" class="header_image" color="#17191e" alt="" link="" target="_self">

<img src="images/slider1_image_3.jpg" class="header_image" color="#3f0731" alt="" link="" target="_self">

</div>

<div class="header_controls">

<a href="#" id="header_controls_left" style="opacity: 1; ">

Previous</a>

<a href="#" id="header_controls_right" style="opacity: 1; ">

Next</a>

</div>

<div id="overlay_bg" style="height: 468px; "></div>

</div>

</div>

<!–/ slider –>

</body>

</html>

下载地址

立即下载

1.《jquery绚丽绽放焦点广告效果》援引自互联网，旨在传递更多网络信息知识，仅代表作者本人观点，与本网站无关，侵删请联系页脚下方联系方式。

2.《jquery绚丽绽放焦点广告效果》仅供读者参考，本网站未对该内容进行证实，对其原创性、真实性、完整性、及时性不作任何保证。

3.文章转载时请保留本站内容来源地址，https://www.cxvn.com/code/focus/384.html