首页 网络技术
  1. 正文

JavaScript怎么实现左右全屏大图焦点图幻灯片切换效果

<!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>WIN8风格左右全屏大图焦点图幻灯片切换样式</title>

<meta name="keywords" content="jquery特效,图片滚动,全屏大图焦点图" />

<meta name="description" content="WIN8风格左右全屏大图焦点图幻灯片切换样式。" />

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

 

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

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

 

</head>

<body>

 

<div id="gallery">

 


<ul id="slides" class="visual">


<a href="#"><li class="visual1 slide"></li></a>


<a href="#"><li class="visual2 slide"></li></a>


<a href="#"><li class="visual3 slide"></li></a>


<a href="#"><li class="visual4 slide"></li></a>


</ul>



<div class="topbar">


<div class="switch">


  <ul id="storeimgs" class="storeimgs">


<li class="menuItem" id="t_li_1">


<div class="slide-tipslide-tip-first ">


  <div class="slide-title">网站建设</div>


  <div class="slide_icon slide_icon1"></div>


  <div class="icdetail">[<a href="#">基础型网站套餐</a>]&nbsp;&nbsp;[<a href="#">精美型网站套餐</a>]<br />[<a href="#">豪华型网站套餐</a>]&nbsp;&nbsp;[<a href="#">B2C电子商务网站</a>]</div>


</div>


<div class="jt" style="display: block; "></div>


</li>


<li class="menuItem" id="t_li_2">


<div class="slide-tip">


  <div class="slide-title">js代码</div>


  <div class="slide_icon slide_icon2"></div>


  <div class="icdetail">[<a href="#">jquery特效</a>]&nbsp;&nbsp;[<a href="#">焦点图</a>]<br /><a href="#" class="download">tab选项卡下载</a></div>


</div>


<div class="jt"></div>


</li>


<li class="menuItem" id="t_li_3">


<div class="slide-tip">


  <div class="slide-title">基础业务</div>


  <div class="slide_icon slide_icon3"></div>


  <div class="icdetail">[<a href="#">域名注册</a>]&nbsp;&nbsp;[<a href="#">企业邮箱</a> ]<br />[<a href="#">网站主机(空间)</a>]</div>


</div>


<div class="jt"></div>


</li>


<li class="menuItem" id="t_li_4">


<div class="slide-tip">


  <a href="#" style="display:block;height:115px;">


<div class="slide-title"></div>



  <div class="icdetail">&nbsp;</div>


  </a>


</div>


<div class="jt"></div>


</li>


  </ul>


</div>


</div>


</div>

 

</body>

</html>

本文标题:JavaScript怎么实现左右全屏大图焦点图幻灯片切换效果
本文链接:https://www.qqooo.cn/post/6964.html
版权说明:网站文章均来源于手工整理和网友投稿,若有不妥之处请来信 xsds@vip.qq.com 处理,谢谢!