javascript - link - jquery w3schools




পৃষ্ঠাতে একটি নির্দিষ্ট উপাদান যেতে কিভাবে? (4)

আমার এইচটিএমএল পৃষ্ঠায়, আমি পৃষ্ঠাতে একটি উপাদানতে 'যেতে' / 'স্ক্রোল টু' / 'ফোকাস অন' করতে সক্ষম হতে চাই।

সাধারণত, আমি একটি href="#something" দিয়ে একটি নোঙ্গর ট্যাগ ব্যবহার করব, কিন্তু আমি ইতিমধ্যে এই পৃষ্ঠাটি লোড করতে BBQ প্লাগইন সহ হ্যাশচেঞ্জ ইভেন্ট ব্যবহার করছি।

তাই পৃষ্ঠাটিতে কোনও নির্দিষ্ট উপাদানতে পৃষ্ঠাটি পেতে জাভাস্ক্রিপ্টের মাধ্যমে অন্য কোন উপায় আছে?

আমি যা করার চেষ্টা করছি তার মূল রূপরেখা এখানে দেওয়া হল:

function focusOnElement(element_id) {
     $('#div_' + element_id).goTo(); // need to 'go to' this element
}

<div id="div_element1">
   yadda yadda 
</div>
<div id="div_element2">
   blah blah
</div>

<span onclick="focusOnElement('element1');">Click here to go to element 1</span>
<span onclick="focusOnElement('element2');">Click here to go to element 2</span>

এখানে যে জন্য একটি সহজ জাভাস্ক্রিপ্ট

যখন আপনার আইডি = "আপনার স্পেসিফিকেলমেন্টমেন্ট" একটি উপাদানতে স্ক্রিন স্ক্রোল করতে হবে তখন এটি কল করুন

window.scroll(0,findPos(document.getElementById("yourSpecificElementId")));

এবং আপনি কাজের জন্য এই ফাংশন প্রয়োজন:

//Finds y value of given object
function findPos(obj) {
    var curtop = 0;
    if (obj.offsetParent) {
        do {
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
    return [curtop];
    }
}

পর্দা আপনার নির্দিষ্ট উপাদান স্ক্রল করা হবে।


প্লাগইন ফর্মের স্ট্যান্ডার্ড টেকনিক এটির মতো কিছু দেখাবে:

(function($) {
    $.fn.goTo = function() {
        $('html, body').animate({
            scrollTop: $(this).offset().top + 'px'
        }, 'fast');
        return this; // for chaining...
    }
})(jQuery);

তারপর আপনি কেবল $('#div_element2').goTo(); স্ক্রোল করতে <div id="div_element2"> । বিকল্প হ্যান্ডলিং এবং কনফিগারযোগ্যতা পাঠক জন্য ব্যায়াম হিসাবে বামে হয়।


আপনার পৃষ্ঠায় একটি নির্দিষ্ট উপাদান স্ক্রোল করতে, আপনি আপনার jQuery(document).ready(function($){...}) একটি ফাংশন যুক্ত করতে পারেন:

$("#fromTHIS").click(function () {
    $("html, body").animate({ scrollTop: $("#toTHIS").offset().top }, 500);
    return true;
});

এটা সব ব্রাউজারে একটি কবজ মত কাজ করে। আপনার প্রয়োজন অনুযায়ী গতি সামঞ্জস্য করুন।


document.getElementById("elementID").scrollIntoView();

একই জিনিস, কিন্তু একটি ফাংশন এটি মোড়ানো:

function scrollIntoView(eleID) {
   var e = document.getElementById(eleID);
   if (!!e && e.scrollIntoView) {
       e.scrollIntoView();
   }
}

এটি একটি আইফোনের আইফ্রেমেও কাজ করে।

GetElementById ব্যবহার করার উদাহরণ: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_document_getelementbyid






html