프로그래밍/HTML+CSS+JavaScript

슬라이딩 윈도우 2

긴자손-1 2009. 10. 21. 18:39
반응형

<script type="text/javascript">

function scrolTop() {

if(document.documentElement.scrollTop!=0)

{

document.documentElement.scrollTop=0;

}

}

function onScll()

{

var a=parseInt(document.documentElement.scrollTop)+300;

var mscroll = document.getElementById("mscroll");

mscroll.style.top=a+"px";

}

</script>

</head>


<body  onScroll=onScll()">


<div id="mscroll" style="top:300px;">

<input type="image"  src="이미지위치" onclick="scrolTop()">

</div>

<div id="wrapper">

<div id ="mainNav"><a></a>

</div>

<div id="content">

<div id="mainContent">

<div class="box">

</div>

<div class="box1">

</div>

<div class="box2">

</div>

<div class="box3">

<a href="주소(ex:블로그나,트위터등등"></a>

</div>

</div>

</div>

<div id="footer">

바닥영역인데......................

</div>

</div>



<script type="text/javascript">

//onScll()

</script>


</body>

</html>

그냥 한 위치에 고정 된듯한 느낌이 드는 슬라이딩 윈도우다...


클릭을 하면 탑으로 가게 되어있다...


간단하게 위치값만 계산에서 고정값을 더해주는 형태로 만들었다...

반응형