Unconfigured Ad Widget

Collapse

Anúncio

Collapse
No announcement yet.

Evento Wheel

Collapse
X
 
  • Filter
  • Tempo
  • Show
Clear All
new posts

  • Font Size
    #1

    Duvida Evento Wheel

    Olá pessoal, estou com dificuldades em diminuir a sensibilidade do scroll na minha aplicação. Abaixo vou colocar o código que estou usando.

    O scroll esta m uito sensivel. A cada toque ele faz a ação, eu gostaria que a ação fosse feita a cada "scrolada" que eu desse e não a cada toque.

    O Plugin (jquery)
    Código:
    /**
     * 
     * credits for this plugin go to brandonaaron.net
     * 	
     * unfortunately his site is down
     * 
     * @param {Object} up
     * @param {Object} down
     * @param {Object} preventDefault
     */
    jQuery.fn.extend({
    	mousewheel: function(up, down, preventDefault) {
    		return this.hover(
    			function() {
    				jQuery.event.mousewheel.giveFocus(this, up, down, preventDefault);
    			},
    			function() {
    				jQuery.event.mousewheel.removeFocus(this);
    			}
    		);
    	},
    	mousewheeldown: function(fn, preventDefault) {
    		return this.mousewheel(function(){}, fn, preventDefault);
    	},
    	mousewheelup: function(fn, preventDefault) {
    		return this.mousewheel(fn, function(){}, preventDefault);
    	},
    	unmousewheel: function() {
    		return this.each(function() {
    			jQuery(this).unmouseover().unmouseout();
    			jQuery.event.mousewheel.removeFocus(this);
    		});
    	},
    	unmousewheeldown: jQuery.fn.unmousewheel,
    	unmousewheelup: jQuery.fn.unmousewheel
    });
    
    
    jQuery.event.mousewheel = {
    	giveFocus: function(el, up, down, preventDefault) {
    		if (el._handleMousewheel) jQuery(el).unmousewheel();
    		
    		if (preventDefault == window.undefined && down && down.constructor != Function) {
    			preventDefault = down;
    			down = null;
    		}
    		
    		el._handleMousewheel = function(event) {
    			if (!event) event = window.event;
    			if (preventDefault)
    				if (event.preventDefault) event.preventDefault();
    				else event.returnValue = false;
    			var delta = 0;
    			if (event.wheelDelta) {
    				delta = event.wheelDelta/120;
    				if (window.opera) delta = -delta;
    			} else if (event.detail) {
    				delta = -event.detail/3;
    			}
    			if (up && (delta > 0 || !down))
    				up.apply(el, [event, delta]);
    			else if (down && delta < 0)
    				down.apply(el, [event, delta]);
    		};
    		
    		if (window.addEventListener)
    			window.addEventListener('DOMMouseScroll', el._handleMousewheel, false);
    		window.onmousewheel = document.onmousewheel = el._handleMousewheel;
    	},
    	
    	removeFocus: function(el) {
    		if (!el._handleMousewheel) return;
    		
    		if (window.removeEventListener)
    			window.removeEventListener('DOMMouseScroll', el._handleMousewheel, false);
    		window.onmousewheel = document.onmousewheel = null;
    		el._handleMousewheel = null;
    	}
    };


    As ações
    Código:
    // WHEEL
    					
    				$("body").mousewheel(function(objEvent, intDelta){
    					if (intDelta > 0){
    					   intOverallDelta++;
    					   $("#divScroll").html('Up - (' + intOverallDelta + ')');
    					   if(intOverallDelta == 2){
    							$("#larva").stop().animate({"top": "440px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-2192px"}, "fast");
    							valor = 1;	
    						}else if(intOverallDelta == 4){
    							$("#larva").stop().animate({"top": "330px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-1644px"}, "fast");							
    							valor = 2;	
    						}else if(intOverallDelta == 6){
    							$("#larva").stop().animate({"top": "220px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-1096px"}, "fast");
    							valor = 3;	
    						}else if(intOverallDelta == 8){
    							$("#larva").stop().animate({"top": "110px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-548px"}, "fast");
    							valor = 4;	
    						}else if(intOverallDelta == 10){
    							$("#larva").animate({"top": "0px"}, "fast");
    							$("ul#slider").stop().stop().animate({"top": "0px"}, "fast");
    							valor = 5;	
    						}else if(intOverallDelta > 10){
    							$("#larva").animate({"top": "0px"}, "fast");
    							$("ul#slider").stop().stop().animate({"top": "0px"}, "fast");							
    							valor = 5;								
    						}
    						if(intOverallDelta > 10){
    							intOverallDelta = 1;
    						}
    						
    						return false;
    						
    					}
    					else if (intDelta < 0){
    						intOverallDelta--;
    					   $("#divScroll").html('Down - (' + intOverallDelta + ')');
    					  if(intOverallDelta == 2){
    							$("#larva").stop().animate({"top": "440px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-2192px"}, "fast");
    							valor = 1;	
    						}else if(intOverallDelta == 4){
    							$("#larva").stop().animate({"top": "330px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-1644px"}, "fast");							
    							valor = 2;	
    						}else if(intOverallDelta == 6){
    							$("#larva").stop().animate({"top": "220px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-1096px"}, "fast");
    							valor = 3;	
    						}else if(intOverallDelta == 8){
    							$("#larva").stop().animate({"top": "110px"}, "fast");
    							$("ul#slider").stop().animate({"top": "-548px"}, "fast");
    							valor = 4;	
    						}else if(intOverallDelta == 10){
    							$("#larva").animate({"top": "0px"}, "fast");
    							$("ul#slider").stop().stop().animate({"top": "0px"}, "fast");
    							valor = 5;
    						}else if(intOverallDelta == 0){
    							$("#larva").animate({"top": "0px"}, "fast");
    							$("ul#slider").stop().stop().animate({"top": "0px"}, "fast");
    							valor = 5;
    						}else if(intOverallDelta < 2){
    							$("#larva").stop().animate({"top": "0px"}, "fast");
    							$("ul#slider").stop().animate({"top": "0px"}, "fast");							
    							valor = 5;								
    						}
    						if(intOverallDelta < 0){
    							intOverallDelta = 9;
    						}
    						
    						return false;
    						
    					}
    				});

  • Font Size
    #2
    não implente scroll com javascript isso é problemático ( firefox da um bug que a região de scroll não tem um delimitador de area , tu vai ter que fixar isso com mouseenter e mouseout ), mas caso queira, a abordagem é diminuir a distancia e não o valor o delta, faz o seguinte , verifica se está indo para cima ou para baixo,
    depois usa o "-=50px" ou Npx do jquery , que isso vai pegar o valor atual, e depois adiciona ou remove n do valor.
    e caso ainda estiver alto, diminua o tempo para que se faça a animate

    Comment

    X
    Working...
    X