JQuery- এ আমি কীভাবে পিতামাতার সাথে সম্পর্কিত এবং ডকুমেন্টের সাথে সম্পর্কিত নয় এমন কোনও উপাদানের "শীর্ষ, বাম" বৈশিষ্ট্যগুলি সেট করতে পারি?

Question

.offset([coordinates])পদ্ধতিটি একটি উপাদানের স্থানাঙ্ক সেট করে তবে কেবলমাত্র নথির সাথে সম্পর্কিত। তারপরে আমি কীভাবে কোনও মৌলিকের স্থানাঙ্ক সেট করতে পারি তবে পিতা-মাতার তুলনায় কীভাবে পারি?

আমি খুঁজে পেয়েছি যে .position()পদ্ধতিটি পিতামাতার সাথে সম্পর্কিত "শীর্ষ, বাম" মানগুলি পেয়েছে , তবে এটি কোনও মান সেট করে না।

আমি চেষ্টা করেছিলাম

$("#mydiv").css({top: 200, left: 200});

কিন্তু কাজ করে না।

Answer 1

পিতামাতার তুলনায় অবস্থান নির্ধারণ করতে আপনার position:relativeপিতামাতার এবং position:absoluteউপাদানটির সেট করতে হবে

$("#mydiv").parent().css({position: 'relative'});
$("#mydiv").css({top: 200, left: 200, position:'absolute'});

এটি কাজ করে কারণ position: absolute;অবস্থানগুলি তুলনামূলকভাবে নিকটস্থ অবস্থানযুক্ত পিতামাতার কাছে (যেমন, ডিফল্ট ব্যতীত অন্য কোনও অবস্থানের সম্পত্তি সহ নিকটতম অভিভাবক static)।

Comments

$("#mydiv").css({top: '200px', left: '200px', position:'absolute'});<- ভাল $("#mydiv").css({top: '200', left: '200', position:'absolute'});<- খারাপ। স্পষ্টতই, অবস্থানের মানগুলি যদি স্ট্রিং হয় তবে আপনাকে অবশ্যই ইউনিটগুলি অন্তর্ভুক্ত করতে হবে, অথবা এর কোনও প্রভাব থাকবে না।

— বব স্টেইন

কোনও আপেক্ষিক পজিশন পিতামাতা থাকার বিষয়ে সেই নোটটি আমাকে অনেক হতাশাকে বাঁচিয়েছিল। ধন্যবাদ.

— নিউক্লিয়ার পিওন

Answer 2

$("#mydiv").css('top', 200);

$("#mydiv").css('left', 200);

Comments

আরও কিছু নির্দেশনা এখানে সহায়তা করবে

— কবুতর

বা $ ("# মাইডিভ")। সিএসএস (top 'শীর্ষ': 200, 'বাম': 200});

— নিক বি

অন্য কথায়, ওপি যদি সঠিকভাবে "শীর্ষ" এবং "বাম" উদ্ধৃত হত তবে তা সঠিক হত?

— RufusVS

Answer 3

আপনি jQuery UI এর। অবস্থান পদ্ধতি চেষ্টা করতে পারেন ।

$("#mydiv").position({
  of: $('#mydiv').parent(),
  my: 'left+200 top+200',
  at: 'left top'
});

কাজের ডেমো পরীক্ষা করুন Check

Comments

.পজিশনে () এর কোনও সেটার নেই

— devnull69

এটি ঠিক কোথায় বলে যে এটি অবস্থান নির্ধারণ করতে পারে? আমি মনে করি এটি কেবল মানগুলি আবিষ্কার করতে পারে, সেগুলি পরিবর্তন করতে পারে না।

— ক্রিস

। অবস্থান () পদ্ধতিটি মান নির্ধারণ করে না!

— সর্বোচ্চ 11

খুব আকর্ষণীয়!!! আপনার কোডটি খুব কার্যকর যখন আপনি পিতামাতার উপাদানগুলির সিএস পজিশন সম্পত্তি সেট করতে সক্ষম না হন (মূল উত্তর হিসাবে উল্লিখিত) কারণ এটি একটি ইউআই উইজেট এবং আপনি কোনও মসৃণ ক্রিয়াকলাপের জন্য এর সেটিংস পরিবর্তন করতে চান না। অবশ্যই আপনি যখন jQuery UI ব্যবহার করছেন তখনই এটি ঘটে। এই ছোট সমস্যাটি আমি jQuery UI "টেনে নেবার যোগ্য" উইজেট সহ পেয়েছি।

— সর্বোচ্চ

Answer 4

আমি দেখতে পেয়েছি যে পাস করা মানটি যদি স্ট্রিংয়ের ধরণ হয় তবে এটি অবশ্যই 'px' (অর্থাৎ 90px) দ্বারা অনুসরণ করা উচিত, যেখানে মানটি পূর্ণসংখ্যা হয়, এটি স্বয়ংক্রিয়ভাবে px সংযোজন করবে। প্রস্থ এবং উচ্চতার বৈশিষ্ট্যগুলি আরও ক্ষমাশীল (উভয় প্রকারের কাজ)।

var x = "90";
var y = "120"
$(selector).css( { left: x, top: y } )        //doesn't work
$(selector).css( { left: x + "px", top: y + "px" } )        //does work

x = 90;
y = 120;
$(selector).css( { left: x, top: y } )        //does work

Answer 5

গতিশীল পৃষ্ঠার জন্য কোড অফসেট গতিশীল

var pos=$('#send').offset().top;
$('#loading').offset({ top : pos-220});

Answer 6

অবস্থান স্থির করে আমার স্মৃতি সতেজ করে, আমি এত দেরীতে এসেছি আমি জানি না অন্য কেউ এটি দেখতে পাবে কিনা, তবে -

আমি অবস্থানটি ব্যবহার করে পছন্দ করি না css(), যদিও প্রায়শই এটি ঠিক থাকে। আমি মনে করি position()xdazz দ্বারা উল্লিখিত হিসাবে jQuery UI এর সেটারটি ব্যবহার করা সবচেয়ে ভাল বাজি । তবে jQuery UI যদি কোনও কারণে হয় তবে কোনও বিকল্প নয় (এখনও jQuery হয়), আমি এটি পছন্দ করি:

const leftOffset = 200;
const topOffset = 200;
let $div = $("#mydiv");
let baseOffset = $div.offsetParent().offset();
$div.offset({
  left: baseOffset.left + leftOffset,
  top: baseOffset.top + topOffset
});

এর ইচ্ছামত $divপিতামাতাকে আপেক্ষিক অবস্থানে স্থাপন না করার সুবিধা রয়েছে (যদি $divতার পিতা-মাতা নিজেই ছিলেন তবে অন্য কোনও কিছুর অভ্যন্তরে পরম অবস্থানে থাকতেন কি?)। আমি মনে করি যদি একমাত্র প্রধান প্রান্ত ক্ষেত্রে দেখা যায় $divকোনো না offsetParent, না নিশ্চিত হলে ফিরে আসবে document, nullঅথবা সম্পূর্ণরূপে অন্য কিছু।

offsetParent ২০০৮ এর একসময়, jQuery ১.২.। থেকে উপলব্ধ ছিল, সুতরাং এই কৌশলটি এখন এবং কখন আসল প্রশ্ন জিজ্ঞাসা করা হয়েছিল তা কার্যকর হয়।

Answer 7

এর offset()ফাংশন ব্যবহার করুন jQuery। এখানে এটি হবে:

$container.offset({
        'left': 100,
        'top': mouse.y - ( event_state.mouse_y - event_state.container_top ) 
    });