A

롤링배너객체 Rolling

· 2008-09-18 (목) 17:55:11 · 4419
------------------------------------- Config -------------------------------------
var myRolling = new Rolling(appendElement,width,height,방향[0-좌,1-우,2-상,3-하],스크롤픽셀,호출주기,딜레이);
myRolling.box.innerHTML = "";
myRolling.box.innerHTML += "<div style='width:80px; height:20px; background:#FEA700;'>1</div>";
myRolling.box.innerHTML += "<div style='width:80px; height:20px; background:#FEDD00;'>2</div>";
myRolling.box.innerHTML += "<div style='width:80px; height:20px; background:#FEF500;'>3</div>";
myRolling.box.innerHTML += "<div style='width:80px; height:20px; background:#D7FE00;'>4</div>";
myRolling.Init();    //객체초기화
myRolling.Run();    //객체실행
------------------------------------- Config -------------------------------------


<html>
<head>
<title></title>
<script type="text/javascript" src="Rolling.js"></script>
</head>
<body>

<div id="test1" style="border: 1px solid #000000; width: 800px; height: 150px;"></div>
<br><br>
<div id="test2" style="border: 1px solid #000000; width: 800px; height: 150px;"></div>
<br><br>
<div id="test3" style="border: 1px solid #000000; width: 800px; height: 150px;"><br><br><br></div>
<br><br>
<div id="test4" style="border: 1px solid #000000; width: 800px; height: 150px;"></div>

<script type="text/javascript">
var myRolling1 = new Rolling(document.getElementById("test1"),700,26,2,2,30,3000);
myRolling1.box.innerHTML = "";
myRolling1.box.innerHTML += "<div><nobr><img src='http://www.phpschool.com/menu_images/top_menu1_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu2_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu3_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu4_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu5_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu6_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu7_off.gif'><img src='http://www.phpschool.com/menu_images/top_menu8_off.gif'></nobr></div>";
myRolling1.box.innerHTML += "<div><nobr><img src='http://www.phpschool.com/menu_images/top_menu1_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu2_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu3_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu4_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu5_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu6_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu7_on.gif'><img src='http://www.phpschool.com/menu_images/top_menu8_on.gif'></nobr></div>";
myRolling1.Init();
myRolling1.Run();

var myRolling2 = new Rolling(document.getElementById("test2"),240,50,0,2,10,1000);
myRolling2.box.style.border = "1px solid orange";
myRolling2.box.innerHTML = "";
myRolling2.box.innerHTML += "<div style='width:80px; height:20px; background:#FEA700;'>1</div>";
myRolling2.box.innerHTML += "<div style='width:80px; height:20px; background:#FEDD00;'>2</div>";
myRolling2.box.innerHTML += "<div style='width:80px; height:20px; background:#FEF500;'>3</div>";
myRolling2.box.innerHTML += "<div style='width:80px; height:20px; background:#D7FE00;'>4</div>";
myRolling2.Init();
myRolling2.Run();

var myRolling3 = new Rolling(document.getElementById("test3"),700,30,1,2,1,100);
myRolling3.box.style.border = "1px solid green";
myRolling3.box.innerHTML = "";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#FEA700;'>1</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#FEDD00;'>2</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#FEF500;'>3</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#D7FE00;'>4</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#B9FE00;'>5</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#83FE00;'>6</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#30FE00;'>7</div>";
myRolling3.box.innerHTML += "<div style='width:80px; height:20px; background:#38EF0D;'>8</div>";
myRolling3.Init();
myRolling3.Run();

var myRolling4 = new Rolling(document.getElementById("test4"),400,140,3,2,40,1000);
myRolling4.box.style.border = "1px solid red";
myRolling4.box.innerHTML = "";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#FEA700;'>1</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#FEDD00;'>2</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#FEF500;'>3</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#D7FE00;'>4</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#B9FE00;'>5</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#83FE00;'>6</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#30FE00;'>7</div>";
myRolling4.box.innerHTML += "<div style='width:300px; height:20px; background:#38EF0D;'>8</div>";
myRolling4.Init();
myRolling4.Run();
</script>

</body>
</html>
[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]

첨부파일

Rolling.js (5.6 KB) 150회 2008-09-18 17:55
|
댓글을 작성하시려면 로그인이 필요합니다.

개발자팁

5,403건

개발과 관련된 유용한 정보를 공유하세요. 질문은 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
기타 08-10-30 조회 2,682
JavaScript 08-10-30 조회 2,906
기타 08-10-29 조회 3,508
기타 08-10-29 조회 2,200
JavaScript 08-10-20 조회 2,281
MySQL 08-10-18 조회 4,361
기타 08-10-16 조회 3,189
기타 08-10-14 조회 2,229
기타 08-10-11 조회 3,605
JavaScript 08-10-11 조회 2,802
MySQL 08-10-08 조회 3,986
기타 08-10-02 조회 3,813
기타 08-10-02 조회 2,261
PHP 08-09-29 조회 4,897
기타 08-09-29 조회 3,911
기타 08-09-26 조회 7,520
PHP 08-09-26 조회 4,411
PHP 08-09-26 조회 4,024
PHP 08-09-26 조회 3,097
PHP 08-09-26 조회 4,174
PHP 08-09-26 조회 3,780
PHP 08-09-26 조회 4,586
기타 08-09-22 조회 3,041
기타 08-09-22 조회 2,756
기타 08-09-21 조회 3,600
JavaScript
[JavaScript]
08-09-20 조회 4,465
JavaScript 08-09-20 조회 2,773
기타 08-09-20 조회 3,098
MySQL 08-09-19 조회 7,659
기타 08-09-19 조회 2,866