html中图片连续滚动代码,[转载]网页设计中的图片连续滚动效果——代码「建议收藏」

html中图片连续滚动代码,[转载]网页设计中的图片连续滚动效果——代码「建议收藏」style=”overflow:hidden;width:500px;”>border=”0″>id=”butong_net_left1″valign=”top”align=”center”>border=”0″>src=”src=”插入需要滚动的图片”>src=”插入需要滚动的图片”>src=”插入需要滚动的图片”>src=”插入需要滚动的图片”&gt…

大家好,又见面了,我是你们的朋友全栈君。

style=”overflow:hidden;width:500px;”>

border=”0″>

id=”butong_net_left1″ valign=”top”

align=”center”>

border=”0″>

src=”

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

valign=”top”>

var speed=30//速度数值越大速度越慢

butong_net_left2.innerHTML=butong_net_left1.innerHTML

function Marquee3(){

if(butong_net_left2.offsetWidth-butong_net_left.scrollLeft<=0)

butong_net_left.scrollLeft-=butong_net_left1.offsetWidth

else{

butong_net_left.scrollLeft++

}

}

var MyMar3=setInterval(Marquee3,speed)

butong_net_left.οnmοuseοver=function()

{clearInterval(MyMar3)}

butong_net_left.οnmοuseοut=function()

{MyMar3=setInterval(Marquee3,speed)}

style=”overflow:hidden;width:500px;”>

border=”0″>

id=”butong_net_right1″ valign=”top”

align=”center”>

border=”0″>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

src=”插入需要滚动的图片”>

valign=”top”>

var speed=30//速度数值越大速度越慢

butong_net_right2.innerHTML=butong_net_right1.innerHTML

function Marquee4(){

if(butong_net_right.scrollLeft<=0)

butong_net_right.scrollLeft+=butong_net_right2.offsetWidth

else{

butong_net_right.scrollLeft–

}

}

var MyMar4=setInterval(Marquee4,speed)

butong_net_right.οnmοuseοver=function()

{clearInterval(MyMar4)}

butong_net_right.οnmοuseοut=function()

{MyMar4=setInterval(Marquee4,speed)}

style=overflow:hidden;height:100;width:90;>

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

id=butong_net_top2>

var speed=30

butong_net_top2.innerHTML=butong_net_top1.innerHTML

//克隆butong_net_top1为butong_net_top2

function Marquee1(){

//当滚动至butong_net_top1与butong_net_top2交界时

if(butong_net_top2.offsetTop-butong_net_top.scrollTop<=0)&<60;&<60;

butong_net_top.scrollTop-=butong_net_top1.offsetHeight

//butong_net_top跳到最顶端

else{

butong_net_top.scrollTop++;

}

}

var MyMar1=setInterval(Marquee1,speed)//设置定时器

//鼠标移上时清除定时器达到滚动停止的目的

butong_net_top.οnmοuseοver=function() {clearInterval(MyMar1)}

//鼠标移开时重设定时器

butong_net_top.οnmοuseοut=function(){MyMar1=setInterval(Marquee1,speed)}

style=overflow:hidden;height:100;width:90;>

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

%E6%8F%92%E5%85%A5%E9%9C%80%E8%A6%81%E6%BB%9A%E5%8A%A8%E7%9A%84%E5%9B%BE%E7%89%87

id=butong_net_bottom2>

var speed=30

butong_net_bottom2.innerHTML=butong_net_bottom1.innerHTML

butong_net_bottom.scrollTop=butong_net_bottom.scrollHeight

function Marquee2(){

if(butong_net_bottom1.offsetTop-butong_net_bottom.scrollTop>=0)

butong_net_bottom.scrollTop+=butong_net_bottom2.offsetHeight

else{

butong_net_bottom.scrollTop–

}

}

var MyMar2=setInterval(Marquee2,speed)

butong_net_bottom.οnmοuseοver=function()

{clearInterval(MyMar2)}

butong_net_bottom.οnmοuseοut=function()

{MyMar2=setInterval(Marquee2,speed)}

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/161317.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 看看别人是如何进行大数据测试的?

    看看别人是如何进行大数据测试的?前言:我之前是做大数据测试的,熟悉我的小伙伴应该都知道,前面我写过两篇文章《什么是大数据测试?》、《怎么进行大数据测试?我们需要具备怎样的测试能力?》,当然,这篇文章我对大数据测试介绍的比较笼统,所以今天我在详细补充一下,主要是看看别人是如何进行大数据测试的,另外我推荐在做大数据测试的同学或者将要做大数据测试的同学去看看我正在看的两本书,我想看了之后你应该是有收获的——《机器人学习测试入门与实践》、《大数据测试技术与实践》,第一本书是我20年买的,第二本书是我21年买的,总体我收获还是挺多的!看看别人是如

  • PLC编程入门基础技术知识

    PLC编程入门基础技术知识PLC编程入门基础技术知识第一章可编程控制器简介可编程序控制器,英文称ProgrammableController,简称PC。但由于PC容易和个人计算机(PersonalComputer)混淆,故人们仍习惯地用PLC作为可编程序控制器的缩写。它是一个以微处理器为核心的数字运算操作的电子系统装置,专为在工业现场应用而设计,它采用可编程序的存储器,用以在其内部存储执行逻辑运算、顺序控制、定时/计数和算术运算等操作指令,并通过数字式或模拟式的输入、输出接口,控制各种类型的机械或生产过程。PLC是微机技术与

  • 电力IEC104规约协议解读(含源码下载)

    电力IEC104规约协议解读(含源码下载)说明:文章大部分内容参考自网络,填写原创是因为转载只能填写一个连接主要参考文章:https://www.cnblogs.com/meandme/p/10112380.htmlhttps://blog.csdn.net/chenyitao736866376/article/details/99120024http://www.myexception.cn/c-sharp/1801406.htmlhttp://www.doc88.com/p-096107619768.html(参考的较.

  • 十二、Maven项目模板「建议收藏」

    十二、Maven项目模板「建议收藏」Maven提供用户,使用原型的概念,不同类型的项目模板(以数字614)是一个非常大的列表。Maven帮助用户快速开始使用以下命令创建新的Java项目mvnarchetype:generate什么是原型?原型是一个Maven插件,其任务是创建一个项目结构按照其模板。我们将使用快速启动原型插件在这里创建一个简单的Java应用程序。使用项目模板让我们打开命令控制

  • python中关于命名的例子_Python 命名规范入门实例「建议收藏」

    python中关于命名的例子_Python 命名规范入门实例「建议收藏」这篇文章主要为大家详细介绍了Python命名规范入门实例,具有一定的参考价值,可以用来参考一下。对python这个高级语言感兴趣的小伙伴,下面一起跟随512笔记的小编两巴掌来看看吧!一,包名、模块名、局部变量名、函数名全小写+下划线式驼峰example:this_is_var二,全局变量全大写+下划线式驼峰example:GLOBAL_VAR三,类名首字母大写式驼峰example:ClassNa…

  • ora 12154: tns: could not resolve the connect identifier specified问题的一种解决方法

    ora 12154: tns: could not resolve the connect identifier specified问题的一种解决方法
     
    开发环境:VS2010,Oracle10gXE.
     
    不熟悉C#连接Oracle数据库,从Baidu上Copy了一段相关代码,谁知道这么悲剧,还得我调了三天……
     
    先贴上害我不浅的小小两行代码:

    stringConnectionString=”DataSource=oraDB;User=Username;Password=Password”;//连接字符串 
     
     OracleConn

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号