상세 컨텐츠

본문 제목

javascript 쿽메뉴 만들기(쿽배너)

script

by 2hansoul 2022. 1. 26. 20:28

본문

반응형

 

<style>


.quickmenu {
position:absolute;
width:90px;
top:50%;
margin-top:-50px;
right:90px;
}

</style>
<h3 id="top">top</h3>
<div class="quickmenu" style="z-index:4;">
	<ul >
	<li ><a href="../test/cccc.php">quick</a></li>
    <li>menu</li>
	<li><a href="#top">top</a></li>
	</ul>
</div>

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(document).ready(function(){
  var currentPosition = parseInt($(".quickmenu").css("top"));
  $(window).scroll(function() {
    var position = $(window).scrollTop();
    $(".quickmenu").stop().animate({"top":position+currentPosition+"px"},500);
  });
});

</script>

<h3 id="top">top</h3> id값으로 잡아두고 
<div class="quickmenu" style="z-index:4;">
<ul >
<li ><a href="../test/cccc.php">quick</a></li>
    <li>menu</li>
<li><a href="#top">top</a></li> a 태그로 링크를 걸어주면 제일 위쪽으로 이동이 가능하다
</ul>
</div>

 

 

반응형

관련글 더보기

댓글 영역