حرکت یک صفحه بر روی بقیه [بایگانی]

سلیمانی پور

یک شنبه 22 شهریور 1388, 00:14 صبح

سلام
استفاده از این شیوه که با جاوااسکریپت انجام شده است را به شما پیشنهاد می کنم.
کدهای زیر را به عنوان یک فایل HTML ذخیره کرده و تست کنید.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Drop-in content box</title>
<script language="JavaScript1.2">

var ie=document.all
var dom=document.getElementById
var ns4=document.layers
var calunits=document.layers? "" : "px"

var bouncelimit=32
var direction="up"

function initbox(){
if (!dom&&!ie&&!ns4)
return
crossobj=(dom)?document.getElementById("dropin").style : ie? document.all.dropin : document.dropin
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
crossobj.top=scroll_top-250+calunits
crossobj.visibility=(dom||ie)? "visible" : "show"
dropstart=setInterval("dropin()",50)
}

function dropin(){
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
if (parseInt(crossobj.top)<100+scroll_top)
crossobj.top=parseInt(crossobj.top)+40+calunits
else{
clearInterval(dropstart)
bouncestart=setInterval("bouncein()",50)
}
}

function bouncein(){
crossobj.top=parseInt(crossobj.top)-bouncelimit+calunits
if (bouncelimit<0)
bouncelimit+=8
bouncelimit=bouncelimit*-1
if (bouncelimit==0){
clearInterval(bouncestart)
}
}

function dismissbox(){
if (window.bouncestart) clearInterval(bouncestart)
crossobj.visibility="hidden"
}

function truebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = ""
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset)
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(off set, end))
}
}
return returnvalue;
}

function dropornot(){
if (get_cookie("droppedin")==""){
window.onload=initbox
document.cookie="droppedin=yes"
}
}
dropornot()
</script>
</head>

<body>
<div id="dropin" style="position:absolute;visibility:hidden;left:200px;top :100px;width:500px;height:300px;background-color:#F5F5F5">

<div align="right"><a href="#" onClick="dismissbox();return false">[Close] </a></div>

محتویات باکسی که هنگام لودینگ سایت نمایش داده می شود
که در این قسمت می توانید عکس نیز قرار بدهید

</div>
</body>

</html>

موفق باشید.