링크 관련 팁 예제 입니다.
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
?>
<script language="javascript">
$(document).ready(function(){
var defaultclass;
$("li").filter(function(){return $(this).attr("link");}).css("cursor", "pointer").hover(function(){
defaultclass = $(this).attr("class");
$(this).addClass($(this).attr("over"));
}, function(){
$(this).removeClass($(this).attr("over")).addClass(defaultclass);
}).click(function(){
location.href=$(this).attr("link");
});
});
</script>
<style type="text/css">
<!--
.cafetop {
height: 35px;
width: 956px;
background-image: url(<?=$sitemap_skin_path?>/img/sepcial-menu-bg.gif);
font-family: "돋움", "굴림";
font-size: 11px;
line-height: 35px;
font-weight: bolder;
color: #E3FFDD;
padding-top: 0px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
margin: 0px;
}
.cafetop .menu {
float: left;
margin-top: 0px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 5px;
}
.menuover {
font-size: 11px;
color: #009933;
}
.cafetop img {
margin-top: 12px;
height: 11px;
width: 2px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
-->
</style>
<ul class="cafetop">
<li link="#" class="menu" over="menuover">공지사항</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">전체글보기</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">베스트게시물</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">이미지모아보기</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">동영상모아보기</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">카페태그보기</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">자유로운글</li>
<li class="menu"><img src="<?=$sitemap_skin_path?>/img/sepcial-menu-line.gif" /></li>
<li link="#" class="menu" over="menuover">카페앨범</li>
</ul>
댓글 2개