www.webdeveloper.com
Results 1 to 3 of 3

Thread: Mouse-wheel scroll javascript not working on some web browsers

  1. #1
    Join Date
    Aug 2009
    Posts
    20

    Unhappy Mouse-wheel scroll javascript not working on some web browsers

    I'm using the following javascript to mouse-wheel scroll through a horizontal web page. It works great in Firefox and Explorer but doesn't work in Safari and Chrome. Please help!

    Code:
    /* Tiny Scrolling - a smooth navigation between internal links and their destinations
    by Marco Rosella - http://www.centralscrutinizer.it/en/design/js-php/tiny-scrolling
    based on the works by Travis Beckham and Brian McAllister.
                    v0.3 - March 27, 2006
    */
    
    window.onload = function() {
    	tinyScrolling.init();
    	}
    
    var tinyScrolling = {
    	speed : 50,      //set here the scroll speed: when this value increase, the speed decrease. 
    	maxStep: 150,	 //set here the "uniform motion" step for long distances
    	brakeK: 3,		 //set here the coefficient of slowing down
    	hash:null,		
    	currentBlock:null,
    	requestedY:0,
    	init: function() {
    			var lnks = document.getElementsByTagName('a');   
    			for(var i = 0, lnk; lnk = lnks[i]; i++) {   
    				if ((lnk.href && lnk.href.indexOf('#') != -1) &&  ( (lnk.pathname == location.pathname) ||
    				('/'+lnk.pathname == location.pathname) ) && (lnk.search == location.search)) {  
    				lnk.onclick = tinyScrolling.initScroll;   		
    				}   
    			}
    	},
    	getElementYpos: function(el){
    			var y = 0;
    			while(el.offsetParent){  
    				y += el.offsetTop    
    				el = el.offsetParent;
    			}	return y;
    	},		
    	getScrollTop: function(){
    			if(document.all) return (document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop;
    			else return window.pageYOffset;   
    	},	
    	getWindowHeight: function(){
    			if (window.innerHeight)	return window.innerHeight;
    			if(document.documentElement && document.documentElement.clientHeight) return document.documentElement.clientHeight;
    	},
    	getDocumentHeight: function(){
    			if (document.height) return document.height;
    			if(document.body.offsetHeight) return document.body.offsetHeight;
    	},
    	initScroll: function(e){
    			var targ;  
    			if (!e) var e = window.event;
    			if (e.target) targ = e.target;
    			else if (e.srcElement) targ = e.srcElement;   
    			tinyScrolling.hash = targ.href.substr(targ.href.indexOf('#')+1,targ.href.length); 
    			tinyScrolling.currentBlock = document.getElementById(tinyScrolling.hash);   
    			if(!tinyScrolling.currentBlock) return;
    			tinyScrolling.requestedY = tinyScrolling.getElementYpos(tinyScrolling.currentBlock); 
    			tinyScrolling.scroll();  
    			return false;
    	},
    	scroll: function(){
    			var top  = tinyScrolling.getScrollTop();
    			if(tinyScrolling.requestedY > top) {  
    				var endDistance = Math.round((tinyScrolling.getDocumentHeight() - (top + tinyScrolling.getWindowHeight())) / tinyScrolling.brakeK);
    				endDistance = Math.min(Math.round((tinyScrolling.requestedY-top)/ tinyScrolling.brakeK), endDistance);
    				var offset = Math.max(2, Math.min(endDistance, tinyScrolling.maxStep));
    			} else { var offset = - Math.min(Math.abs(Math.round((tinyScrolling.requestedY-top)/ tinyScrolling.brakeK)), tinyScrolling.maxStep);
    			} window.scrollTo(0, top + offset);  
    			if(Math.abs(top-tinyScrolling.requestedY) <= 1 || tinyScrolling.getScrollTop() == top) {
    				window.scrollTo(0, tinyScrolling.requestedY);
    				if(!document.all || window.opera) location.hash = tinyScrolling.hash;
    				tinyScrolling.hash = null;
    			} else 	setTimeout(tinyScrolling.scroll,tinyScrolling.speed);
    	}		
    }

  2. #2
    Join Date
    Apr 2006
    Location
    Houston
    Posts
    1,374
    You do not need a script. Page scrolling is the default action of the mouse wheel in most browsers

  3. #3
    Join Date
    Aug 2009
    Posts
    20
    The code is for a horizontal website...there's no vertical scroll at all..It's a horizontal scroll of width 30000px!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center

"

"

X vBulletin 4.2.2 Debug Information

  • Page Generation 0.15633 seconds
  • Memory Usage 2,863KB
  • Queries Executed 15 (?)
More Information
Template Usage (33):
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)ad_thread_first_post_content
  • (1)ad_thread_last_post_content
  • (1)bbcode_code
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (3)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (3)postbit
  • (3)postbit_onlinestatus
  • (3)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (26):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (73):
  • init_startup
  • friendlyurl_resolve_class
  • init_startup_session_setup_start
  • database_pre_fetch_array
  • database_post_fetch_array
  • init_startup_session_setup_complete
  • global_bootstrap_init_start
  • global_bootstrap_init_complete
  • cache_permissions
  • fetch_postinfo_query
  • fetch_postinfo
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates