scrollIntoView fonksiyonu, elementin içinde bulunduğu ana elementin kaydırma çubuğunun (scroll) elementi gösterecek şekilde kaydırılmasını sağlar.
Sözdizimi
element.scrollIntoView(ustemi);
| ustemi | true olması durumunda element, ana elementinin üst tarafına hizalanır. false olması durumunda alt tarafına hizalanır. |
Aşağıdaki örnek, rastgele içeriğe sahip iki farklı paragrafın scrollIntoView metodu ile ana elementlerinin üst kısmına hizalanarak görünür olmalarının sağlanmasını göstermektedir.
<input type="button" value="1. Paragrafı Göster" onClick="parag1Goster()"/>
<input type="button" value="2. Paragrafı Göster" onClick="parag2Goster()"/>
<div style="height:100px; width:300px; overflow: scroll; border: 1px solid #808080;">
<div style="height: 100px; background-color:#fff0f0;">Rastgele içerik 1</div>
<p id="parag1">1. Paragraf içeriği</p>
<div style="height: 100px; background-color:#f0fff0;">Rastgele içerik 2</div>
<p id="parag2">2. Paragraf içeriği</p>
<div style="height: 100px; background-color:#f0f0ff;">Rastgele içerik 3</div>
</div>
<script type="text/javascript">
function parag1Goster()
{
var P1 = document.getElementById('parag1');
P1.scrollIntoView(true);
}
function parag2Goster()
{
var P2 = document.getElementById('parag2');
P2.scrollIntoView(true);
}
</script>
Test Edin