Trying to .scrollLeft with $(window).load function and not working

StackOverflow https://stackoverflow.com/questions/21901521

문제

My problem should be quite simple to solve and I want to do it properly to function across browsers. I would like to have a horizontal scrollbar with overflow-x:scroll and overflow-y:hidden align itself at a specified .scrollLeft position with any refresh of my website.

I have come up with:

<head>
<script type="text/javascript">
$(window).load(function(){
$('outside, html').scrollLeft (100);
});
</script>

<style type="text/css">
div#outside {
width: 100%;
overflow-x: scroll;
overflow-y: hidden;
}
div#inside { width: 500px;  }
</style>
</head>

<body>
<div id="outside">
<div id="inside">A bunch of text here...
</div>
</div>
</body>

I found a JSFiddle to use as a template for my attempt but it does not work when I preview in dreamweaver browsers (safari, chrome, firefox). I am pretty sure this is a simple fix and if anybody could help that would be much appreciated. Thanks!

http://jsfiddle.net/v6EwS/

도움이 되었습니까?

해결책

I think you have to use window.onload event for this,you can use this like this..

HTML

<body onload="myFunction()">
   <div id="foo">
      <div id="bar">
         Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. Hello world. 
         </div>
     </div>
 </body>

JAVASCRIPT

<script type="text/javascript">
   function myFunction(){
      document.getElementById('foo').scrollLeft = 500;
   }
</script>

다른 팁

Try this.

//$( "#foo" ).scrollLeft( 500 );  // Without animation
$("#foo").animate({scrollLeft:500})   // With animation

Fiddle Demo

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top