asp.net 頁面圖片滾動(dòng)問題

圖片滾動(dòng)啦，這些效果我認(rèn)為用jquery比較好，需要的話你可以提出來我?guī)湍銓懀?/p>

創(chuàng)新互聯(lián)公司-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比莊河網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式莊河網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們，業(yè)務(wù)覆蓋莊河地區(qū)。費(fèi)用合理售后完善，十多年實(shí)體公司更值得信賴。

把以下js的代碼改成JQuery（圖片走馬燈）

寫了個(gè) 大概的，還有很大改進(jìn)的余地，照著思路改改吧~

!doctype?html

html

head

meta?charset="utf-8"

title/title

style?type="text/css"

li{

display:?inline;

}

#scroll_div{

width:?200px;

margin:?0?auto;

overflow:?hidden;

white-space:?nowrap;

position:?relative;

}

/style

script?type="text/javascript"?src=""/script

script?type="text/javascript"

$.fn.scrollImgLeft?=?function(options)?{

var?def={

speed:1,

scrollDiv:$('#scrollDiv'),

scrollBegin:$('#scrollBegin'),

scrollEnd:$('#scrollEnd')

}

var?opts?=?$.extend(def,?options);

opts.scrollEnd.html(opts.scrollBegin.html());

function?Marquee()?{?

if?(opts.scrollEnd.outerWidth(true)?-?opts.scrollDiv.scrollLeft()?=?0)?{?

opts.scrollDiv.scrollLeft()?-=?opts.scrollBegin.outerWidth(true);?

}?else?{?

opts.scrollDiv.scrollLeft(opts.scrollDiv.scrollLeft()+1);?

}?

}?

var?MyMar?=?setInterval(Marquee,opts.speed)?

scroll_div.onmouseover?=?function?()?{?

clearInterval(MyMar);?

}?

scroll_div.onmouseout?=?function?()?{?

MyMar?=?setInterval(Marquee,?opts.speed);?

}

};?

$(function(){

var?opt?=?{

speed:2,

?? scrollDiv:$('#scroll_div'),

?? scrollBegin:$('#scroll_begin'),

?? scrollEnd:$('#scroll_end')

}

$('#scroll_div').scrollImgLeft(opt);

})

/script

/head

body

div?id="scroll_div"

div?id="scroll_begin"

ul

li11111111/li

li222222/li

li3333/li

li444444/li

li55555555/li

/ul

/div

/div

div?id="scroll_end"/div

/body

/html

jQuery 走馬燈 三張圖下面有三個(gè)圓點(diǎn) 沒有左右切換

你看看這種符不符合要求，圓點(diǎn)的話可以自己寫出發(fā)切換圖片的事件就可以了，如果不是這種你可以去鏈接的站點(diǎn)找里面的JS很全

dreamweaver網(wǎng)頁制作中，怎樣實(shí)現(xiàn)圖片的走馬燈效果

打開 Dreamweaver

新建 HTML 文檔；

修改標(biāo)題為"跑馬燈"

保存為 index.html 文件。

首先，編寫跑馬燈部分的靜態(tài) HTML 代碼，把圖片排列起來

在 body 和 /body 標(biāo)簽中添加以下代碼：

div

　ul

liimg src="img/1.jpg" //li

liimg src="img/2.jpg" //li

liimg src="img/3.jpg" //li

liimg src="img/4.jpg" //li

liimg src="img/5.jpg" //li

liimg src="img/6.jpg" //li

liimg src="img/7.jpg" //li

　/ul

/div

給上一步的 HTML 代碼中的 div 標(biāo)簽增加 class 屬性，如下：

　div class="con"

編寫跑馬燈部分的 CSS 樣式代碼，代碼放在 head 和 /head 標(biāo)簽中，如下：

style type="text/css"

　ul{list-style:none; padding:0; margin:0;}

　.con{ width:1105px; height:225px; overflow:hidden; border:2px solid #666; margin:10px auto 0 auto; padding:5px 0 0 5px;}

　.con ul li{ float:left; margin:0 5px 10px 0;}

　.con ul li img{ display:block; width:209px; height:209px; padding:2px; border:1px solid #ccc;}

/style

引入 JQuery 庫

　script type="text/javascript" src="jquery-1.11.0.min.js"/script

引入 Marquee 插件

　script type="text/javascript" src="marquee2.js"/script

代碼放在 /body 標(biāo)簽前，如圖：

給 div 增加 marquee 類

　div class="con marquee"

保存文件，在瀏覽器中打開，就可以看到圖片開始滾動(dòng)了。

圖片默認(rèn)的滾動(dòng)方向是“向上滾動(dòng)”

如果要修改圖片滾動(dòng)的方向，可以給 div 指定 direction 屬性，屬性值可以取：

　up 上

　down 下

　left 左

　right 右

css中走馬燈程序如何設(shè)計(jì)

看到這些回答，感到很悲哀。給樓主一個(gè)走馬燈CSS，谷歌和IE通過。

marquee width="98%" white-space: nowrap;overflow:-webkit-marquee;　-webkit-marquee-direction:left;-webkit-marquee-speed:normal;-webkit-marquee-style:scroll;-webkit-marquee-repetition:infinite;頁面滾動(dòng)test/marquee