2016-07-20 8 views
1

Funktion blättern zu der rechten oberen Ecke des DIV in jQuery

<div style=width:200px;height:200px;border-style:solid;overflow:scroll;> 
 
    <div style=width:500px;height:500px;> 
 
    Text, something 
 
    </div> 
 
</div>

Dies ist beispielsweise HTML-Code zu bewegen. Ich muss die Ansicht (Scroll) von div nach right-top-on-Ereignis verschieben (zum Beispiel beim Klicken auf die Schaltfläche).

Antwort

1

Versuchen jQuery .scrollLeft(). Hier ist der Arbeitscode.

$(function() { 
 
    $('#scroll').click(function() { 
 
    var $scroll = $('.scrollthis'); 
 
    $scroll.parent().scrollLeft($scroll.width()); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div style="width:200px; height:200px; border-style:solid; overflow:scroll;"> 
 
    <div class="scrollthis" style="width:500px; height:500px;"> 
 
    Text, something 
 
    </div> 
 
</div> 
 
<button id="scroll">Scroll</button>

+0

dieses blättern nicht nach rechts oben. Es scrollt nur zum rechten Rand. Versuchen Sie, in die untere linke Ecke zu scrollen und drücken Sie die Scroll-Taste. –

1

fand ich eine Lösung:

$(MainDiv).scrollLeft(DivInsideWidth); 
$(MainDiv).scrollTop(0); 
2

scrollLeft und scrollTop ist der richtige Weg, aber Sie können für eine bessere Flexibilität Animation und dynamischen Werte hinzufügen: https://jsfiddle.net/twey5d7u/

Verwandte Themen