PHP Ionic Angular HTML5 AJAX Javascript CSS MySQL jQuery Forum


สร้างป้ายโฆษณาเลื่อนตามจอภาพ ด้วย jquery ได้ในไม่กี่บรรทัด

14 November 2008 By Ninenik Narkdee
banner เลื่อนตามจอ jquery

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ banner เลื่อนตามจอ jquery



ส่วนของ Javascript Code

<script language="javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
var name = "#float_banner"; 
var locateY= null;  
$(function(){
	locateY=parseInt($(name).css("top").replace("px",""));
	$(window).scroll(function(){
		offset=locateY+$(document).scrollTop()+"px";
		$(name).animate({top:offset},{duration:1000,queue:false});
	});
});
</script>

CSS และ HTML Code

<style type="text/css">
div#float_banner{
	position:absolute;
	width:150px;
	display:block;
	top:150px;
	height:61px;
}
</style>
<div id="float_banner">
<a href="http://www.cmsproweb.com/" target="_blank">
<img src="http://www.ninenik.com/img/link/1224135320.jpg" />
</a>
</div>

ตัวอย่างผลลัพธ์







Tags:: เลื่อนตามจอ jquery banner






อย่าลืมกด Like กด Share เป็นกำลังใจ ในการสร้างบทความใหม่ๆ น่ะครับ


URL สำหรับอ้างอิง