Geek Answers Handbook

Onclick scroll event - syntax?

Trying to make it scroll based on whether it was clicked on the left or right side of the page. It doesn't seem to work. Maybe my syntax is incorrect or the method that I use to find the left or right side of the page?

with <body onclick="scrollevent()"> :

  <script> function scrollevent() { var y=0; var pwidth = $('#slideshow').width(); var mouseY = ev.clientY; if (mouseY<(pwidth/2) { $('#slideshow').animate({scrollLeft: "+=400"}); } else{ $('#slideshow').animate({scrollLeft: "-=400"}); } } </script>
+4
source share
4 answers

You can use the pageX property rather than the pageY of the event object, try the following:

The position of the mouse relative to the left edge of the document.

 $(document).click(function(e){ // or $(document).on('mousemove', function(e){ var mp = e.pageX; var w = $(window).width() / 2; if (mp < w) { $('#slideshow').animate({scrollLeft: "+=400"}); } else { $('#slideshow').animate({scrollLeft: "-=400"}); } })

Please note that there is a syntax error in your code, you missed it ) :

 if (mouseY<(pwidth/2) {

it should be:

 if ( mouseY < (pwidth/2) ) {
+1
source

The .animate () method allows you to create animation effects for any CSS numeric property.

http://api.jquery.com/animate/

.scrollLeft () is a jQuery function, not a css property.

upd: my bad as the docs say:

In addition to style properties, some animated properties, such as scrollTop and scrollLeft, as well as custom properties, can be animated.

+1
source

You are using clientY.

Use clientX instead of clientY to check if it is clicked on the left or right side of the page.

Demo can be found here: http://jsfiddle.net/codebombs/UT9xK/

0
source

Line:

 if (mouseY<(pwidth/2) {

no closing ) . Try the following:

 if (mouseY<(pwidth/2)) {
0
source

More articles:


All Articles