매우 우수한 효과 코드는 왼쪽과 오른쪽으로 위아래로 스크롤 할 수 있으며 수집했습니다! !
<! doctype html public "-// w3c // dtd xhtml 1.0 엄격한 // en" "http://www.w.w3.org/tr/xhtml1/dtd/xhtml1-Strict.dtd"><Html xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type"content = "text/html; charset = gb2312"/> <titling> 스크롤 테스트 </title> <스크립트 형식 = "Text/javaScript">/** @obj. "데모"데모, Deml1, Demo2는 반복되지 않는 한 * * @para 스크롤 속도가 커지고, 스크롤 속도가 커지고, 스크롤 방향이 더 느리게 스크롤링 방향은 다음과 같습니다. * @para contentById 특정 ID ContentSyId로 내용을 스크롤하여 자동으로 얻을 수 있습니다.이 스크롤 및 FilePath는 공존 할 수 없습니다. * * @para usage instance scrollobject ( "res", 50, "up", 470,200, "", "resource") ContentById (resource) * * @para 사용 인스턴스 scrollobject ( "res", 50, "up", "d : // images //")에서 내용을 스크롤하십시오. 현재, IE */ var $ = function (id) {return document.getElementById (id)} // scroll function scrollobject (obj, speed, direction, direction, objwidth, objheight, filepath, contentsyid) {// direction == "|| | | direction ="doper.write (udstructure ()); else document.write (lrstructure ()); var demo = $ (obj); var demo1 = $ (obj+"1"); var demo2 = $ (obj+"2"); var 속도 = 속도; $ (contentSyId) .style.display = "none"demo.style.overflow = "hidden"; demo.style.width = objwidth+"px"; demo.style.height = objheight+"px"; demo.style.margin = "0 Auto"; if (filepath! = "") demo1.innerhtml = file (); if (contentById! = "") demo1.innerHtml = $ (contentById) .innerHtml; demo2.innerhtml = demo1.innerhtml; // 왼쪽 및 오른쪽 함수 스크롤 lrstructure () {var _html = ""; _html+= "<div id = '"+obj+"'>"; _html+= "<테이블 테두리 = '0'align = '왼쪽'cellPadding = '0'cellspace = '0'cellspace = '0'>"; _html+= "<tr>"; _html+= "<td nowrap = 'nowrap'id = '"+obj+"1'>"; // 여기에 scrolled_html+= "</td>"; _html+= "<td nowrap = 'nowrap'id = '"+obj+"2'> </td>"; _html+= "</tr>"; _html+= "</tr>"; _html+= "</table>"; _html+= "</div>"; 반환 _html; } // 구조를 위아래로 스크롤하는 구조 함수 udtructure () {var _html = ""; _html+= "<div id ="+obj+">"; _html+= "<테이블 테두리 = '0'align = '왼쪽'cellPadding = '0'cellspace = '0'>"; _html+= "<tr>"; _html+= "<td id = '"+obj+"1'>"; // 여기에 scrolled_html+= "</td>"; _html+= "<tr>"; _html+= "<tr>"; _html+= "<td id = '"+obj+"1'>"; // 여기에 scrolled_html+= "</td>"; _html+= "<tr>"; _html+= "<tr>"; _html+= "<td id = '"+obj+"2'> </td>"; _html+= "</tr>"; _html+= "</table>"; _html+= "</div>"; 반환 _html; } // 이미지 함수 파일을 가져옵니다 () {var tbsource = filepath; // 로컬 폴더 경로 filepath = filepath.toString (); if (filepath == "") retoy ""; var imglist = ""; var objfso = new ActiveXobject ( 'scripting.filesystemobject'); // if (! objfso.follexists (tbsource)) {alert ( "<" "+tbsource+"> 폴더 경로가 존재하지 않거나 경로에 파일 이름을 포함 할 수 없습니다! "); objfso = null; 반품; } var objfolder = objfso.getfolder (tbsource); var colfiles = 새로운 열거 자 (objfolder.files); var re_inf1 = //. jpg $/; // 폴더 파일이 (;! colfiles.atend (); colfiles.movenext ())의 jpg 파일인지 확인하십시오. // 폴더에서 파일을 읽습니다 {var objfile = colfiles.item (); if (re_inf1.test (objfile.name.tolowercase ())) {imglist+= "<img src ="+filepath+"/"+objfile.name+">"; }} return imglist; } // scroll left function left () {if (demo2.offsetwidth-demo.scrollleft <= 0) {demo.scrollleft- = demo1.offsetwidth; } else {demo.scrollleft ++; }} // Right Function Right () {if (demo.scrollleft <= 0) {demo.scrollleft- = demo1.offsetWidth; } else {demo.scrollleft ++; }} // Right Function Right () {if (demo.scrollleft <= 0) {demo.scrollleft+= demo2.offsetWidth; } else {demo.scrollleft--}} // function down () {if (demo1.offsettop-demo.scrolltop> = 0) {demo.scrolltop+= demo2.offsetheight; } else {demo.scrolltop--}} // function up () {if (demo2.offsettop-demo.scrolltop <= 0) {demo.scrolltop- = demo1.offsetheight; } else {demo.scrolltop ++}} // 방향 스위칭 함수 swichdirection () {switch (direction) {case "left": return left (); 부서지다; 사례 "오른쪽": RETURRIOL (); 부서지다; CASE "UP": return UP (); 부서지다; 기본값 : Return Down (); }} // 반복 var mymarquee = setInterval (swichDirection, Speed); // demo.onmouseover = function () {clearinterval (mymarquee);} // 다시 스크롤을 다시 시작하기 시작 Demo.onMouseOut = function () {myMarquee = setInterVal (swichDipection, Speed);}}}}}}}}}}}}}}}}}}}}}}}}}}}}}} <emg "> <테이블 allign ="CellPadding = "" ""CellPadding = "" " CellPacing = "0"> <td> <td> <img src = "http://attach.e.iciba.com/attachment/200910/22/4188617_1256194098532.jpg"/> </td> <img src = "http://pica.nipic.com/2008-05-27/2008527145211519_2.jpg"/> </td> <td> <img src = "http://pic4.nipic.com/20090823/383152_215728074589_2.jpg"/> </td> <td> <img src = "http://pic8.nipic.com/20100628/4643449_170245009531_2.jpg"/> </td> <td> <img src = "http://pica.nipic.com/2008-05-30/20085309524648_2.jpg"/> </td> </tr> </table> </div> <스크립트 type = "text/javaScript"> scrollObject ( "sr", 50, "오른쪽", 800,160, "", "IMG") </script> </body> </html>위는이 기사의 전체 내용입니다. JavaScript에 대한 자세한 내용은 "JavaScript 참조 자습서"및 "JavaScript Code Style Guide"를 확인하십시오. 또한 모두가 wulin.com을 더 지원하기를 바랍니다.