이미지나 내용 들이 위아래로 롤링되는 jQuery 임.
이거 별로 추천하진 않음.. 조금 지저분 하기 때문에..
내가 이코드가 어서 난건지도 모르겠음 내가 만든게 아니라..
허나 작동은 잘 하니..흠흠..;;;;
우선 첨부파일 부터
그리고 스크립트는..
$(function() {
var content = " ";
var rollingDiv = $("#rolling");
rollingDiv.rolling("up", 250, 65); //위로 올라가질 밑으로 갈지 결정,가로사이즈,세로사이즈
var tname = $("textarea","#rollingId")
var cnt = tname.length; // 롤링갯수 세려고
var f = document.rollingForm;
if(cnt == 1){ // 1개일때는 롤링을 하지 않는다.
var item = eval("f.item0.value");
rollingDiv.html(jQuery.trim(item));
}else{
for (var i = 0; i < cnt; i++) {
var item = eval("f.item" + i + ".value");
if (item != "") {
rollingDiv.addRollingItem(jQuery.trim(item));
content += "rollingDiv.addRollingItem(\"" + jQuery.trim(item) + "\");\r\n";
}
}
}
rollingDiv.bind("mouseover", function() { //마우스 올라가면 멈춤
$("#rolling").stopRolling();
});
rollingDiv.bind("mouseout", function() { //마우스 없어지면 다시 롤링
$("#rolling").resumeRolling();
});
rollingDiv.startRolling(50, 0, 150); // 페이지 롤링 맨 마지막 150은 속도, 높을수록 느려짐
});
<div id="rolling">
</div>
저위에 jquery중에
rollingDiv.addRollingItem(jQuery.trim(item));
content += "rollingDiv.addRollingItem(\"" + jQuery.trim(item) + "\");\r\n";
위 코드를 부분 을 밑에처럼 변경하시면 됩니다. 그럼 밑에 form같은거 필요없음
rollingDiv.addRollingItem('<a href='naver.com'><img src='이미지 경로'></a>');
코드 보다보면 이상함이 느껴질것이다.
textarea 나오고 막 form 나오고 어쩌구 하는데 그냥 무시...;;
저건..음 막 이미지만 롤링되는게 아니라 html내용 자체가 롤링되어야 해서..
form만들고 그안에 textarea 안에 코드 넣어서 어쩌구 한건데 쓰레기임..;;
굳이 본다면..밑에 마냥..;;
<FORM id=rollingId name=rollingForm>
<TEXTAREA style="DISPLAY: none" wrap=off rows=0 cols=0 name=item0><table width='250'>
<tr valign='top'>
<td rowspan='2' width='62'>
<img src='이미지주소' width='60' height='65' onClick='view();' style='cursor:hand;'>
</td>
<td class='b' style='padding-left:8px;'>
<a href='#' class='ti'>타이틀 </a>
</td>
</tr>
<tr valign='top'>
<td class='text' style='padding-left:8px;'><a href='#' class='te' return false;'>내용</a></td>
</tr>
</table>
</TEXTAREA>
</FORM>
Comment Write
Comment List