js点击焦点图切换 jQuery过渡幻灯片切换

黑魔仙 2019-11-19 331 阅读

特效描述:利用jQuery实现 过渡 幻灯片切换,利用jQuery实现过渡幻灯片切换

代码结构

1. 引入JS

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

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

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

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

2. 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=gb2312">
<title></title>
<LINK href="css/css.css" type=text/css rel=stylesheet>
</HEAD>
<br>
<body oncontextmenu='return false' ondragstart='return false'>
<div class="main">
<div class="focusimg fL" id="play">
<div id="play_list">
<A href="http://www.cxvn.com/" target=_blank><img src="images/img01.jpg" /></A>
<A href="http://www.cxvn.com/" target=_blank><img src="images/img02.jpg" /></A>
<A href="http://www.cxvn.com/" target=_blank><img src="images/img01.jpg" /></A>
<A href="http://www.cxvn.com/" target=_blank><img src="images/img02.jpg" /></A>
<A href="http://www.cxvn.com/" target=_blank><img src="images/img01.jpg" /></A>
<A href="http://www.cxvn.com/" target=_blank><img src="images/img02.jpg" /></A>
<div>
<div id="play_text">
<ul>
<li value=1><img src="images/img01s.jpg" /> </li>
<li value=2><img src="images/img02s.jpg" /> </li>
<li value=3><img src="images/img01s.jpg" /> </li>
<li value=4><img src="images/img02s.jpg" /> </li>
<li value=5><img src="images/img01s.jpg" /></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var p_num = Slideid();
$('#play_list').TrunAd(p_num);
$("#0200").addClass("on");
</script>
<div style="text-align:center;clear:both">
</div>
</body>
</html>

演示地址下载地址

最新游戏