คำสั่งพื้นฐาน การเรียกใช้งาน jQuery กับ CSS (คำสั่ง.scrollLeft())

หมวดสำหรับแบ่งบันความ รู้ต่างๆ จะมีหมวดย่อยๆ ในหมวดนี้ เช่น php, SQL, XML, CSS

Moderators: mindphp, ผู้ดูแลกระดาน

M008
PHP Hero Member
PHP Hero Member
Posts: 109
Joined: 03/05/2013 10:44 am

คำสั่งพื้นฐาน การเรียกใช้งาน jQuery กับ CSS (คำสั่ง.scrollLeft())

Postby M008 » 05/06/2013 6:58 pm

.scrollLeft() เป็นการใช้ jQuery Css กับ .scrollLeft() ในการกำหนดความกว้างของ Scollbar ว่ามีความกว้างเท่าไหร่ถึงจะขึ้น Scollbar โดยอ้างถึงตำแหน่งในด้านซ้าย scrollLeft
Syntax

Code: Select all

.scrollLeft()
.scrollLeft( value )

ตัวอย่างการใช้งาน

Code: Select all

<html>
<head>
<style>
     div.demo {
     background:#CCCCCC none repeat scroll 0 0;
     border:3px solid #666666;
     margin:5px;
     padding:5px;
     position:relative;
     width:500px;
     height:100px;
     overflow:auto;
     }
     p { margin:10px;padding:5px;border:2px solid #666;width:1000px;height:1000px; }
</style>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript">
      $(document).ready(function(){

               $("div.demo").scrollLeft(300);

      });
</script>
</head>
<body>
 
   <div class="demo"><h1>Mindphp</h1><p>Hello</p></div>

</body>
</html>

ผลลัพธ์
2.jpg
2.jpg (20.44 KiB) Viewed 596 times

คำอธิบาย
จากตัวอย่างเป็นการใช้ jQuery Css กับ .scrollLeft() ในการจัดการกับ element ที่อ้างถึง โดยในตัวอย่าง $("div.demo").scrollLeft(500); เป็นการกำหนด $("div.demo") ให้มีความกว้าง 500 px และจากนั้นจะให้การแสดงผลเป็น Scollbar แทน

Return to “Share Knowledge”

Who is online

Users browsing this forum: No registered users and 21 guests