发表新帖
发表新帖

Trigger 'dummy' mouse wheel event

前端 未结
关注
9 891
隐瞒了意图╮
隐瞒了意图╮ 2021-01-03 22:30

Is there a way to trigger a scroll wheel event with an arbitrary delta. Just like jQuery does with \'click\' like:

$(\'#selector\').trigger(\'click\');
相关标签:
9条回答
  • 再見小時候
    2021-01-03 22:50

    This will call the scroll function if you have written any

    $(window).scroll();
    0 讨论(0)
  • 耶瑟儿～
    2021-01-03 22:54

    You need to use jQuery.Event For example:

    // Create a new jQuery.Event object with specified event properties.
var e = jQuery.Event( "DOMMouseScroll",{delta: -650} );

// trigger an artificial DOMMouseScroll event with delta -650
jQuery( "#selector" ).trigger( e );

    Check more here: http://api.jquery.com/category/events/event-object/

    0 讨论(0)
  • 被撕碎了的回忆
    2021-01-03 22:56

    You can try typing this into the console, and see its effects:

    document.body.scrollTop = document.body.scrollTop + 200

    where 200 is an arbitrary number. Similarly, you can also try this with scrollLeft:

    document.body.scrollLeft = document.body.scrollLeft + 200

    or

    document.body.scrollLeft = document.body.scrollLeft - 200

    You could try playing with this concept and the window setInterval() method.

    Additionally........

    You can get the offset of an element as follows:

    jQuery("#vote-to-add-section").offset()

    which will give you a result like:

    {top: 9037.1875, left: 268}

    You could scroll to that element with something like this:

    document.body.scrollTop = jQuery("#vote-to-add-section").offset().top

    Alternatively........

    If you just want the site to already be scrolled down to a particular element when the site is first loaded, you can do this with elements that have an id:

    Add #idnamehere to the end of a url you are seaching. There must be an element with that id name on the page.

    For example compare these URL's, and what you get when you enter them in the URL address bar:

    https://travel.usnews.com/rankings/worlds-best-vacations https://travel.usnews.com/rankings/worlds-best-vacations/#vote-to-add-section

    The one with #vote-to-add-section at the end is automatically scrolled down to the element with id #vote-to-add-section.

    0 讨论(0)
  • 我寻月下人不归
    2021-01-03 23:06 
    this.trigger("mousewheel", {intDelta:0, deltaX:0, deltaY:0});

    actually this works better:

    this.trigger("mousewheel", [0])
    0 讨论(0)
  • 灰色年华
    2021-01-03 23:07

    Hi you can do that by adding a event listener. I have searched for the same and got the below code snippet and it is working. check you have the same requirement

    <html>
<head>
<title>Mouse Scroll Wheel example in JavaScript</title>
 <style>
 #scroll {
 width: 250px;
 height: 50px;
 border: 2px solid black;
 background-color: lightyellow;
 top: 100px;
 left: 50px;`enter code here`
 position:absolute;
 }
 </style>
 <script language="javascript">
 window.onload = function()
 {
//adding the event listerner for Mozilla
if(window.addEventListener)
    document.addEventListener('DOMMouseScroll', moveObject, false);

//for IE/OPERA etc
document.onmousewheel = moveObject;
 }
function moveObject(event)
{
var delta = 0;

if (!event) event = window.event;

// normalize the delta
if (event.wheelDelta) {

    // IE and Opera
    delta = event.wheelDelta / 60;

} else if (event.detail) {

    // W3C
    delta = -event.detail / 2;
}

var currPos=document.getElementById('scroll').offsetTop;

//calculating the next position of the object
currPos=parseInt(currPos)-(delta*10);

//moving the position of the object
document.getElementById('scroll').style.top = currPos+"px";
document.getElementById('scroll').innerHTML = event.wheelDelta + ":" + event.detail;
}
</script>
</head>
<body>
Scroll mouse wheel to move this DIV up and down.
<div id="scroll">Event Affect</div>
</body>
</html>
------------------------------------------------------------

    based on the delta variable you can write your own custom functionality.

    In html 5 mouse scroll event is being handled you can try in that way also

    0 讨论(0)
  • 情歌与酒
    2021-01-03 23:09

    Have you tried this? http://jquerytools.org/documentation/toolbox/mousewheel.html A plugin to "take control of the mousewheel" :)

    0 讨论(0)
 看不清?
提交回复
热议问题