네버엔딩 빈틈없는 한줄씩 채워지는 스크롤 최근게시물..
아마 비슷한 자료가 있을꺼 같지만..
필요해서 만들어 쓰다보니.. 좋은거 같아 올려봅니다.
특징.
1. 스크롤될때.. 마지막게시풀 스크롤되고 난후 빈공간이 나타나질 앖습니다.
2. 디스플레이 될 사각박스의 높이를 옵션에서 지정할수 있습니다.
3. 기타 깔끔한것 같습니다. ^^
예제사이트 :
http://www.moc4u.co.kr/
소스코드
============
lastest.skin.php
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
if(!$options){ $options = 20 ; }
// 사용법 latest("ones_tic", "테이블명", "게시풀출력수", "제목길이", "디스플레이될박스의높이");
// 예문 latest("ones_tic", "keawon_news", 10, 30, 80);
?>
<script type="text/javascript">
var intervalID<?=$bo_table?>;
function loadBanner() {
clearInterval(intervalID);
intervalID=setInterval(displayBanner,30);
}
function loadBannerT<?=$bo_table?>() {
clearInterval(intervalID<?=$bo_table?>);
intervalID<?=$bo_table?>=setInterval(displayBannerT<?=$bo_table?>,20);
}
function displayBanner() {
banner1.offsetLeft>-banner1.offsetWidth ? moveLeft(banner1) : stopMove(banner1);
banner2.offsetLeft>-banner2.offsetWidth ? moveLeft(banner2) : stopMove(banner2);
banner3.offsetLeft>-banner3.offsetWidth ? moveLeft(banner3) : stopMove(banner3);
banner4.offsetLeft>-banner4.offsetWidth ? moveLeft(banner4) : stopMove(banner4);
}
function displayBannerT<?=$bo_table?>() {
<?
$ii = 1;
$lcount = count($list);
$lcountsize = ($lcount * 20) - 20 ;
for ($i=0; $i<count($list); $i++) { ?>
banner<?=$bo_table?><?=$ii?>.offsetTop>-banner<?=$bo_table?><?=$ii?>.offsetHeight ? moveTop<?=$bo_table?>(banner<?=$bo_table?><?=$ii?>) : stopMoveT<?=$bo_table?>(banner<?=$bo_table?><?=$ii?>);
<? $ii++; } ?>
}
function moveLeft(obj) {
obj.style.left=obj.offsetLeft-1;
}
function moveTop<?=$bo_table?>(obj) {
obj.style.top=obj.offsetTop-1;
}
function stopMove(obj) {
obj.style.left=359;
clearInterval(intervalID);
intervalID=setInterval(loadBanner,1000);
}
function stopMoveT<?=$bo_table?>(obj) {
obj.style.top=<?=$lcountsize?>;
clearInterval(intervalID<?=$bo_table?>);
intervalID<?=$bo_table?>=setInterval(loadBannerT<?=$bo_table?>,2000);
}
<? if($lcount > 0 ){ ?>
loadBannerT<?=$bo_table?>();
<? } ?>
</script>
<table width=100% cellpadding=0 cellspacing=0>
<tr>
<td align=left style="padding-left:10"><div id = "<?=$bo_table?>" style="position:absolute;border:dotted 0 red;overflow:hidden;width:230;height:<?=$options?>;text-align:left;">
<?
$ii = 1;
$it = 0 ;
for ($i=0; $i<count($list); $i++) { ?>
<span id="banner<?=$bo_table?><?=$ii?>" style="position:absolute;border:solid 0 black;width:220;height:20;left:0;top:<?=$it?>;text-align:left;"><img src='<?=$latest_skin_path?>/img/latest_icon.gif' align=absmiddle> <?
echo "<a href='{$list[$i]['href']}'>";
echo "<font style='font-family:돋움; font-size:9pt; color:#6A6A6A;'>{$list[$i]['subject']}</font>";
echo "</a>"; ?></span>
<?
$ii++;
$it = $it + 20 ;
} ?>
</div>
</td>
</tr>
<? if (count($list) == 0) { ?><tr><td align=center height=50><font color=#6A6A6A>게시물이 없습니다.</a></td></tr><? } ?>
</table>
필요해서 만들어 쓰다보니.. 좋은거 같아 올려봅니다.
특징.
1. 스크롤될때.. 마지막게시풀 스크롤되고 난후 빈공간이 나타나질 앖습니다.
2. 디스플레이 될 사각박스의 높이를 옵션에서 지정할수 있습니다.
3. 기타 깔끔한것 같습니다. ^^
예제사이트 :
http://www.moc4u.co.kr/
소스코드
============
lastest.skin.php
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
if(!$options){ $options = 20 ; }
// 사용법 latest("ones_tic", "테이블명", "게시풀출력수", "제목길이", "디스플레이될박스의높이");
// 예문 latest("ones_tic", "keawon_news", 10, 30, 80);
?>
<script type="text/javascript">
var intervalID<?=$bo_table?>;
function loadBanner() {
clearInterval(intervalID);
intervalID=setInterval(displayBanner,30);
}
function loadBannerT<?=$bo_table?>() {
clearInterval(intervalID<?=$bo_table?>);
intervalID<?=$bo_table?>=setInterval(displayBannerT<?=$bo_table?>,20);
}
function displayBanner() {
banner1.offsetLeft>-banner1.offsetWidth ? moveLeft(banner1) : stopMove(banner1);
banner2.offsetLeft>-banner2.offsetWidth ? moveLeft(banner2) : stopMove(banner2);
banner3.offsetLeft>-banner3.offsetWidth ? moveLeft(banner3) : stopMove(banner3);
banner4.offsetLeft>-banner4.offsetWidth ? moveLeft(banner4) : stopMove(banner4);
}
function displayBannerT<?=$bo_table?>() {
<?
$ii = 1;
$lcount = count($list);
$lcountsize = ($lcount * 20) - 20 ;
for ($i=0; $i<count($list); $i++) { ?>
banner<?=$bo_table?><?=$ii?>.offsetTop>-banner<?=$bo_table?><?=$ii?>.offsetHeight ? moveTop<?=$bo_table?>(banner<?=$bo_table?><?=$ii?>) : stopMoveT<?=$bo_table?>(banner<?=$bo_table?><?=$ii?>);
<? $ii++; } ?>
}
function moveLeft(obj) {
obj.style.left=obj.offsetLeft-1;
}
function moveTop<?=$bo_table?>(obj) {
obj.style.top=obj.offsetTop-1;
}
function stopMove(obj) {
obj.style.left=359;
clearInterval(intervalID);
intervalID=setInterval(loadBanner,1000);
}
function stopMoveT<?=$bo_table?>(obj) {
obj.style.top=<?=$lcountsize?>;
clearInterval(intervalID<?=$bo_table?>);
intervalID<?=$bo_table?>=setInterval(loadBannerT<?=$bo_table?>,2000);
}
<? if($lcount > 0 ){ ?>
loadBannerT<?=$bo_table?>();
<? } ?>
</script>
<table width=100% cellpadding=0 cellspacing=0>
<tr>
<td align=left style="padding-left:10"><div id = "<?=$bo_table?>" style="position:absolute;border:dotted 0 red;overflow:hidden;width:230;height:<?=$options?>;text-align:left;">
<?
$ii = 1;
$it = 0 ;
for ($i=0; $i<count($list); $i++) { ?>
<span id="banner<?=$bo_table?><?=$ii?>" style="position:absolute;border:solid 0 black;width:220;height:20;left:0;top:<?=$it?>;text-align:left;"><img src='<?=$latest_skin_path?>/img/latest_icon.gif' align=absmiddle> <?
echo "<a href='{$list[$i]['href']}'>";
echo "<font style='font-family:돋움; font-size:9pt; color:#6A6A6A;'>{$list[$i]['subject']}</font>";
echo "</a>"; ?></span>
<?
$ii++;
$it = $it + 20 ;
} ?>
</div>
</td>
</tr>
<? if (count($list) == 0) { ?><tr><td align=center height=50><font color=#6A6A6A>게시물이 없습니다.</a></td></tr><? } ?>
</table>
|
댓글을 작성하시려면 로그인이 필요합니다.
그누4 스킨
5,847건스킨의 저작권은 해당 스킨 제작자님께 있으며, 그누보드의 저작권과 다를 수 있습니다. 스킨 다운로드시 좋아요와 감사의 코멘트를 남기시면 제작자에게 큰 힘이됩니다. ^^y 그누보드와 관련이 있지만 스킨과 빌더가 아니면 플러그인 게시판에 올려주세요.
댓글 21개
헤더가 정의되지 않았다고 하네요 ^^
그런데 에러가 나네요..ㅠ.ㅠ
banner3가 정의되지 않았다는..
참고로 다운받은 php말고 여기있는거 긁어서 쓰세요 ㅎ
bannerxx 에러는
1 .div나 span의 id값오류
2. 목록갯수는 2이하로 주면 에러납니다....