CODEWITHSUNDEEP
javascriptscroll
johnnietheblack
johnnietheblack

Reputation: 13310

horizontal scrolling? javascript

I'm looking for a simple method of making a DIV animate horizontally based on anchor points. I'd rather not download an entire library for this if possible...

can anybody suggest any resources for me to learn the inner workings of this?

thanks all:)

Upvotes: 0

Views: 3255

Answers (1)

bobince
bobince

Reputation: 536339

<div style="width: 200px; height: 100px; overflow: scroll; white-space: nowrap">
    FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO
    FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO
    <span id="a1">BAR!</span>
    FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO FOO
</div>
<a href="#a1">scroll to bar (HTML anchor)</a>
<input type="button" value="scroll to bar (JS scrollIntoView)" />
<input type="button" value="scroll to bar (JS scrollLeft)" />

<script type="text/javascript">
    var a1= document.getElementById('a1');
    var buttons= document.getElementsByTagName('input');

    buttons[0].onclick= function() {
        a1.scrollIntoView();
    };
    buttons[1].onclick= function() {
        a1.parentNode.scrollLeft= a1.offsetLeft;
    };
</script>

Upvotes: 1

Related Questions