前端JS特效第36波：jQ多种相册切换效果

强迫老板HelloWord

于 2024-07-14 18:15:00 发布

阅读量207

点赞数 3

文章标签：前端 javascript 开发语言

本文链接：https://blog.youkuaiyun.com/wangtianming88/article/details/139906470

版权

jQ多种相册切换效果，先来看看效果：

部分核心的代码如下：

<!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>jQ多种相册切换效果 - PHP中文网</title>
<script id="jquery_183" type="text/javascript" class="library" src="js/jquery-1.8.3.min.js"></script>
<script id="jquery_183" type="text/javascript" class="library" src="js/jquery.mousewheel.min.js"></script>
</head>

<body>
<div id="main">
  <div id="nav">
  <li value="0" class="navli" id="li1"><span>样式一</span></li>
  <li value="1" class="navli" id="li2"><span>样式二</span></li>
  <li value="2" class="navli" id="li3"><span>样式三</span></li>
  <li value="3" class="navli" id="li4"><span>样式四</span></li>
  <li value="4" class="navli" id="li5"><span>样式五</span></li>
  <li value="5" class="navli" id="li5"><span>样式六</span></li>
  </div>
  <div class="content">
    <div class="pics" id="pc1"></div>
    <div class="pics" id="pc2"></div>
    <div class="pics" id="pc3"></div>
    <div class="pics" id="pc4"></div>
    <div class="pics" id="pc8"></div>
    <div class="pics" id="pc7"></div>
    <div class="pics" id&#

最低0.47元/天解锁文章