求指导,为什么我的焦点图没有效果??

来源:3-8 企业网站制作之焦点图制作

IT远征

2015-05-31 01:22

<!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>
    <link href="慕课网css.css" type="text/css" rel="stylesheet">
    <script src="js" type="text/javascript"></script>
    <script src="js/mf-pattern/mF_YSlider.js" type="text/javascript"></script>
    <link href="js/mf-pattern/mF_YSlider.css" type="text/css" rel="stylesheet">
    <script type="text/javascript">
        myFocus.set({id:'picBox'});
    </script>
</head>
<body>
<div class="top">
    <div class="top_content">
        <ul>
            <li><a href="#">联系我们</a></li>
            <li><a href="#">加入收藏</a></li>
            <li><a href="#">设为首页</a></li>
        </ul>
    </div>
</div><!--top结束-->
<div class="wrap">
      <div class="logo">
          <div class="logoleft">
              <img src="imgs/慕课网images/logo.jpg">
          </div>
          <div class="logoright">
              <img src="imgs/慕课网images/tel.jpg">24小时服务热线:<span class="tel">123-456-7890</span>
          </div>
      </div><!--logo结束-->
<div class="nav">
    <div class="nav_left"></div>
    <div class="nav_mid">
        <div class="nav_mid_left">
            <ul>
                <li><a href="#">首页</a> </li>
                <li><a href="#">关于慕课</a> </li>
                <li><a href="#">新闻动态</a> </li>
                <li><a href="#">课程中心</a> </li>
                <li><a href="#">在线课程</a> </li>
                <li><a href="#">人才招聘</a> </li>
            </ul>
        </div><!--nav_mid_left结束-->
        <div class="nav_mid_right">
            <form method="post" action="">
                <input type="text" class="serch_text">
            </form>
        </div>
    </div><!--nav_mid结束-->
    <div class="nav_right"></div>
</div>    <!--nav结束-->
<div class="ad" id="picBox"><!--焦点图盒子-->
    <div class="pic"><!--内容列表(li数目可以随意增减)-->
        <ul>
            <li><a href="#"><img src="imgs/慕课网images/ad2.jpg" /></a></li>
            <li><a href="#"><img src="imgs/慕课网images/ad3.jpg" /></a></li>
            <li><a href="#"><img src="imgs/慕课网images/ad4.jpg" /></a></li>
        </ul>
    </div>
</div>
</div><!--wrap结束-->

</body>
</html>
*{
    max-resolution: 0;
    padding: 0;
    font-size: 12px;
}
body{background:#F5F5F5;}
.top{width: 100%;height: 27px;background: gray;background: url(imgs/慕课网images/top_bg.jpg) repeat-x;}
.top_content{width: 1000px;margin: 0 auto;}
.top_content li{list-style-image: url(imgs/慕课网images/li_bg.gif);float: right;width: 70px;line-height: 27px;}/*list-style-img:url定义li的图表。。。。line-height代表文字垂直居中*/
.top_content a:link,.top_content a:visited{color:#8E8E8E;text-decoration: none;}/*link代表初始状态颜色为灰色,vistied代表点击后的状态*/
.top_content a:hover,.top_content a:active{color: red;text-decoration: none;}/*hover代表鼠标指针浮动在上面的状态颜色为红色,vistied代表点击时的状态*/
.wrap{width: 1000px;margin: 0 auto;}
.logo{height: 80px;background: #ffffff;}
.logoleft{width:200px;float: left;}
.logoright{width:300px;float: right;margin-top:30px;color: #8E8E8E; }
.logoright img{vertical-align: middle;margin-right: 10px;}/*电话图片居中对齐代码:vertical-align:middle*/
.tel{color:red;font-size: 16px;font-family: 微软雅黑;}/*span属性属于内联属性,不会独占一行另行开始*/

.nav{height: 40px;}
.nav_left{width: 10px;background: url(imgs/慕课网images/nav_left.jpg) no-repeat;}
.nav_mid{width: 980px;background: url(imgs/慕课网images/nav_bg.jpg) repeat-x;}
.nav_right{width:10px;background: url(imgs/慕课网images/nav_right.jpg) no-repeat;}
.nav_mid,.nav_right,.nav_left{height: 40px;float: left}

.nav_mid_left,.nav_mid_right{float: left;}
.nav_mid_left{width: 680px;}
.nav_mid_right{width: 300px;}
.nav_mid_left li{float: left;list-style: none;width:100px;text-align: center;}/*list-style:none代表去掉li前面的小黑点样式*/
.nav_mid_left a:link,.nav_mid_left a:visited{text-decoration: none;color: #ffffff;font-size: 16px;font-family: 微软雅黑;}
.nav_mid_left a:hover,.nav_mid_left a:active{text-decoration: none;color:#ffff00;font-size: 16px;font-family: 微软雅黑;}
.serch_text{width: 190px;height: 25px;margin-top: 5px;background: url(imgs/慕课网images/search.jpg) no-repeat right center #ffffff;padding-right: 25px;border: #ffffff solid 1px;}/*padding-right巧妙设置了输入文本与放大镜的距离*/

.ad{height: 310px;overflow: hidden;}

求指导,为什么我的焦点图不会动?只是单张显示。

写回答 关注

3回答

  • qq_雨譕_03599367
    2016-08-13 10:48:03

    路径库哪里错了?

  • qq_藏鸦_03568402
    2016-07-14 12:12:39

    我怎么觉得没有错啊

  • IT远征
    2015-05-31 20:29:12

    ...删除不了提问的么?

    那就自问自答吧。

    JS库路径错误了。

企业网站综合布局实战

本课程重点介绍HTML/CSS实现常见企业网站布局的方法

157042 学习 · 1984 问题

查看课程

相似问题