网页上动态图片代码，急，求大神。。追加分！

野鼻孔 2013-03-20 02:34:00

大神们好，想做个类似大的网站，图片滚动形式，代码如下

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

</script>

代码链接如下 http://www.cnblogs.com/zhuyiwen/archive/2006/06/07/420119.html

我下载了个，但是不知道怎么用，求大神详解。。

...全文

213 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

functionsub 2013-03-20

打赏
举报

下载focus.swf，放到一个目录下，把代码放到html文件里，更改document.write('<embed src="focus.swf" ');定位到你刚下载的swf文件路径再修改上面那些参数就可以了。 var pics ="image/21.jpg|image/21.jpg"; var links="image/21.jpg|image/21.jpg"; var texts="image/21.jpg|image/21.jpg"; pics是图片的列表，用|分割， links是图片连接的列表，用|分割， texts是说明文字的类表，用|分割。再修改 var focus_width = 996; // 图片宽度 var focus_height= 400; // 图片高度 var text_height = 20; // 显示的文字高度 var swf_height = focus_height + text_height; 调整到你想要的合适的尺寸。

heshengyuboy 2013-03-20

打赏
举报

给你个我写的代码jquery+div实现的滚动，html5+css3的标准ie的显示不是很好你可以改改


<html>
<head>
     
<style>
    div{
        cursor: pointer;
        font-size:10pt;
        }
             
.pb{
    width:300px;/*单个图片的宽（和显示区域相同）*/
    height:300px;/*单个图片的高（和显示区域相同）*/
    }
    #plist{
        position:relative;
        top:-29px;
        }
    #pshow{
    width:300px;/*显示区域的宽度*/
    height:300px;/*显示区域的高度*/
    overflow: hidden;
    position:absolute;
    top:20px;
    left:20px;
        }
</style>
<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script>
    var i=1;
    function pchange(obj){
        var imgtop=((0-(obj-1))*300-29)+"px";
        $("#plist").animate({
        top:imgtop
},"slow");
  i=obj++;
  if(i>4){
        i=1;
        }
        }
 
function timechange(){
    pchange(i);
    i++;
    if(i>4){
        i=1;
        }
        setTimeout('timechange()',3000);
    }
</script>
</head>
 
<body onload="timechange()">
<div id="pshow">
    <div style="display:table;position:relative;left:150px;top:260px;z-index:99;">
    <div style="display:table-cell;width:25px;height:20px;background:#EEEE00;text-align:center;" onmouseover="pchange(1)">1</div>
    <div style="display:table-cell;width:10px;height:20px;"></div>
    <div style="display:table-cell;width:25px;height:20px;background:#EEEE00;text-align:center;" onmouseover="pchange(2)">2</div>
    <div style="display:table-cell;width:10px;height:20px;"></div>
    <div style="display:table-cell;width:25px;height:20px;background:#EEEE00;text-align:center;" onmouseover="pchange(3)">3</div>
    <div style="display:table-cell;width:10px;height:20px;"></div>
    <div style="display:table-cell;width:25px;height:20px;background:#EEEE00;text-align:center;" onmouseover="pchange(4)">4</div>
    </div>
    <div id="plist">
        <div class="pb" style="background:green;">
             
            </div>
                    <div  class="pb" style="background:red;">
             
            </div>
                    <div class="pb" style="background:blue;">
             
            </div>
                    <div  class="pb" style="background:yellow;">
             
            </div>
        </div>
         
</div>
 
</body>
</html>

目前Web前端急缺P6和P7（阿里的很多BU都只招P7了）新的BU你进来即是元老??? 前端技术体系大部分需要一起重新开拓，可以学习到更多的新内容主要负责PC端、客户端、钉钉E应用以及支付宝小程序的开发（我本人完全...

分享一下我老师大神的人工智能教程！零基础，通俗易懂！ http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！原贴:...

脚本之家你与百万开发者在一起众所周知，现实世界和计算机世界是不同的，但是计算机作为人类对现实世界的抽象模拟，在一定程度上，具备了现实世界的基本特征，本文将以哲学角度对比分...

selenium3 是2016年10月份发布的，并且现在默认安装都是selenium3了，selenium3在selenium2的基础上做了一些调整，最明显的区别就是 selenium2对Firefox的支持最高只支持46及以下版本。selenium3可以支持47以上版本...

mm:ss echarts 注意清除画布微前端思想 - qiankun 框架 element.scrollIntoView(true) 滚动视图到指定位置, Drawer 内可用 git submodule 代码复用 scss: bem CSS 文字背景图片创建和触发自定义事件 after 的 ...