জেকুয়েরি জাভাস্ক্রিপ্ট এঙ্গুলার এইচটিএমএল সিএসএস বুটস্ট্রাপ
ফোরাম
 

জেকুয়েরি position() মেথড


« জেকুয়েরি এইচটিএমএল/সিএসএস মেথডসমূহ


সংজ্ঞা এবং ব্যবহার

position() মেথড প্রথম মিলকৃত এলিমেন্টের অবস্থান রিটার্ন করে.

এই মেথড একটি অবজেক্টের সাথে দুটি প্রোপার্টি রিটার্ন করে; পিক্সেলে top এবং left অবস্থান রিটার্ন।


সিনট্যাক্স ও ব্যাখ্যা

$(selector).position()

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        var x = $("p").position();
        alert("Top position: " + x.top + "px" + " Left position: " + x.left + "px");
    });
});
</script>
</head>
<body>

<p>এটি একটি প্যারাগ্রাফ।</p>
<button>p এলিমেন্টের top এবং left অবস্থান রিটার্ন</button>

</body>
</html>

ফলাফল




উদাহরণ

এলিমেন্টের সাপেক্ষে এলিমেন্টের অবস্থান রিটার্ন

কিভাবে <div> এলিমেন্টের ভিতরে একটি <p> এলিমেন্টের অবস্থান পাওয়া যায়।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        x = $("p").position();
        $("#span1").text(x.top);
        $("#span2").text(x.left);
    });
});
</script>
</head>
<body>

<div style="border:1px solid black;padding:80px;margin:30px;">
  <p>এই প্যারাগ্রাফের অবস্থান (parent এলিমেন্টের সাথে সম্পর্কযুক্ত)  <span id="span1">x</span> উপরে এবং <span id="span2">x</span> বামে।</p>
  <button>অবস্থান দেখুন</button>
</div>

</body>
</html>

ফলাফল





« জেকুয়েরি এইচটিএমএল/সিএসএস মেথডসমূহ