jQuery element ilerleyin

SORU

13 Temmuz 2011, ÇARŞAMBA

jQuery element ilerleyin

input Bu öğe var:

<input type="text" class="textfield" value="" id="subject" name="subject">

Sonra diğer bazı elemanlar, girişler, textareas, vb metin gibi.

Kullanıcı tıklattığında #subject Sayfa input güzel bir animasyon ile sayfanın son öğe için kaydırma. Altına kaydırın ve üst değil.

Sayfanın son öğe #submit 10 *düğmesi:

<input type="submit" class="submit" id="submit" name="submit" value="Ok, Done.">

Animasyon çok hızlı olmamalı ve sıvı olmalıdır.

En son jQuery sürümü kullanıyorum. Ama varsayılan jQuery özellikleri elde etmek için kullanmak için herhangi bir eklenti yüklemek için tercih ediyorum.

CEVAP

13 Temmuz 2011, ÇARŞAMBA

Kimliği ile bir düğme olduğunu varsayarsak 'düğme'bu örnek deneyin:

$("#button").click(function() {
    $('html, body').animate({
        scrollTop: $("#elementtoScrollToID").offset().top
    }, 2000);
});

Madde kodu aldımSmoothly scroll to an element without a jQuery plugin. Ve bu örnek üzerinde aşağıda test ettik.

<html>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function (){
            $("#click").click(function (){
                //$(this).animate(function(){
                    $('html, body').animate({
                        scrollTop: $("#div1").offset().top
                    }, 2000);
                //});
            });
        });
    </script>
    <div id="div1" style="height: 1000px; width 100px">
        Test
    </div>
    <br/>
    <div id="div2" style="height: 1000px; width 100px">
        Test 2
    </div>
    <button id="click">Click me</button>
</html>

Bunu Paylaş: