文章目录:
高分!!!!!滚动图片HTML,Script
怎么了不看呢
好用着呢
最新 回答,你看一下,
应该是你要的效果了,给分哦
注意这里的注释,和下面的图片数量。
!-- 1类动态图片添加开始位置--
!-- 这里的图片 长度 要大于等于 div 的长度 请一定注意--
TABLE cellSpacing=1 cellPadding=0 width=656 align=center bgColor=#158fc9 border=0
width="100%"
TBODY
TR
!--头-S--
TD align=left background="images/t_2.gif" bgColor=#ffffff
TABLE height=28 cellSpacing=1 cellPadding=0
width=194 background="images/t_1.gif" border=0
TBODY
TR
TD width=67 style="height:
27px"/TD
TD style="FONT-SIZE: 14px;
height: 27px;" width=124STRONGFONT color=#ffffff图片摄影/FONT/STRONG/TD
/TR
/TBODY
/TABLE
/TD
!--头-E--
/TR
TR
TD bgColor=#ffffff
TABLE cellSpacing=0 cellPadding=0 width="100%"
border=0
TBODY
TR
TD bgColor=#d8d8d8
height=4/TD
/TR
TR
TD
DIV id=demoz
style="overflow:hidden; WIDTH: 99%"
TABLE
cellSpacing=0 cellPadding=0 align=left border=0 cellspace="0"
TBODY
TR
TD id=demo1z vAlign=top
TABLE cellSpacing=0 cellPadding=0 width="100%" border=0
TBODY
TR
!-- 1类动态图片添加开始位置--
!-- 这里的图片 长度 要大于等于 div 的长度 请一定注意--
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
td
img height="100px" width="100px"
src=".." alt=""
/td
!-- 1类动态图片添加结束位置--
/TR
/TBODY
/TABLE
/TD
TD id=demo2z vAlign=top
TABLE cellSpacing=0 cellPadding=0 width="100%" border=0
TBODY
TR
!-- 2类动态图片添加开始位置
--
/TR
/TBODY
/TABLE
/TD
SCRIPT
var speedz = 300;
demo2z.innerHTML = demo1z.innerHTML
function Marqueez() {
//alert(demoz.scrollLeft);
//alert(demo2z.offsetWidth);
if (demo2z.offsetWidth - demoz.scrollLeft = 0) {
demoz.scrollLeft -= demo1z.offsetWidth ;
} else {
demoz.scrollLeft+=10;
}
}
var MyMarz = setInterval(Marqueez, speedz)
demoz.onmouseover = function() { clearInterval(MyMarz) }
demoz.onmouseout = function() { MyMarz = setInterval(Marqueez, speedz) }
/SCRIPT
/TR
/TBODY
/TABLE
/DIV
/TD
/TR
/TBODY
/TABLE
/TD
/TR
/TBODY
/TABLE
求HTML动态图片代码
div id="demo" style="overflow:hidden;width:670px;color:#ffffff;"
table cellpadding="0" cellspacing="0" border="0"
trtd id="demo1" valign="top" align="center"
table cellpadding="2" cellspacing="0" border="0"
tr align="center"
tdimg src="" width="88"/td
tdimg src="" width="88"/td
tdimg src="" width="88"/td
tdimg src="" width="88"/td
tdimg src="" width="88"/td
/tr
/table
/td
td id="demo2" valign="top"/td
/tr
/table
/div
script
var speed=1//速度数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
/script
我的这段代码不会出现跑一段就停下的现象
DIV align=center
DIV id=scroll_div
style="OVERFLOW: hidden; WIDTH: 778px;"
align=center
TABLE border="0" cellpadding="0" cellspacing="0"
TBODY
TR
TD id=scroll_begin
A href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/AA href="#"IMG src="" border=0/A/TD
TD id=scroll_end
/TR/TBODY/TABLE
/DIV/DIV
SCRIPT
var speed=30
var scroll_end = document.getElementById("scroll_end");
var scroll_div = document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML
function Marquee(){
if(scroll_end.offsetWidth-scroll_div.scrollLeft=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth
else{
scroll_div.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
scroll_div.onmouseover=function() {clearInterval(MyMar)}
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
/SCRIPT
HTML canvas背景 转换 gif动态图
我们都知道如何在html5的canvas画布上绘制静态图片(jpeg, png等),直接用canvas中的drawImage方法即可,那么如何绘制动态图片(gif)?
相信大家都知道动态图片之所以动态,是因为它是由很多图片按一定的帧数顺序播放而成的,因此我们是否也可以模拟这样的帧数,每隔一定的时间重新
绘制图片,就能画出动态图片呢?答案当然是YES。下面就是我自己测试的一个例子,代码如下:
!DOCTYPE HTML
2 html
3 head
4 meta charset="utf-8" /
5 titlecanvas上画动态图,视频也可以画/title
6
7 script type="text/javascript"
8 window.onload = function() {
9 var img = document.getElementById('img1');
10 var can = document.getElementById('can');
11 var cxt = can.getContext('2d');
12
13
14 setInterval(function (){cxt.drawImage(img, 0, 0);}, 20);
15 }
16 /script
17 /head
18
19 body
20 p准备绘制的动态图片:/p
21 img id="img1" src="ex.gif" alt="你的浏览器不支持img标签"/img
22 pcanvas画布上绘制的动态图片:/p
23 canvas id="can" width="800px" height="600px" style="background-color: #CCCCCC"你的浏览器不支持canvas标签/canvas
24 /body
25 /html
如果你要动态换,写一个方法,重新替换不就好了,要什么图片换什么!希望5itjob能帮到你
=".." alt="" /td !-- 1类动态图片添加结束位置-- /TR /TBODY /TABLE /TD TD id=demo2z vAlign=top TABLE cellSpacing=0 cellPadding=0 width="100%" bord