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 a
Solution 1:
<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>
Post a Comment for "Horizontal Scrolling? Javascript"