[JavaScript]Wybranie linku po najechaniu na niego. Opcje

[spokoloko123]

Witam,

Tworzę menu tzw. lavalamp. Działa ono w obrębie jednej strony na kotwicach. Chce jednak, żeby po najechaniu na daną pozycję w menu przechodziło do kotwicy. Mam też plugin który zapewnia mi płynne przechodzenie po stronie po klikaniu na kotwice.

Podsumowując:

Wszystko działa gdy kliknę taki link:
<a href="#home">Home</a>

A gdy najadę na taki link:
<a href="#home" onmouseover="window.location.hash='#home'">Home</a>

Otrzymuję "szarpnięcie" to znaczy strona pojawia się w miejscu które mnie interesuje natomiast bez efektu przewijania.

Da się zrobić tak aby po najechaniu na link aktywować ten link a nie podmieniać URL?

[kamil4u]

Zamiast onmouseover="window.location.hash='#home'", wstawić funkcję, która Ci odpowiednio przesunie stronę - patrz manual do pluginu.

[spokoloko123]

Tak wygląda ten plugin. Niestety nie wiem za bardzo jak wybrać napisać ten onmouseover. Będę hiperwdzięczny za pomoc.

[HTML] pobierz, plaintext 
window.onload = function() {
	HtinyScrolling.init(); scrollTips.init();
}
 
function gotoit(target){
	HtinyScrolling.scrollToIt(target);
}
 
var HtinyScrolling = {
	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,
	requestedX: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)) {  
			addEvent(lnk,'click',HtinyScrolling.initScroll,false);
			lnk.onclick=function(){return false;} // Safari
			}   
		}    
	},
	getTarget: function(target) {
		while(target.tagName.toLowerCase() != 'a')
			target = target.parentNode;
		return target;
	},
	getElementXpos: function(el){
		var x = 0;
		while(el.offsetParent){  
			x += el.offsetLeft;    
			el = el.offsetParent;
		}	return x;
	},		
	getScrollLeft: function(){
		if(document.all) return (document.documentElement.scrollLeft) ? document.documentElement.scrollLeft : document.body.scrollLeft;
		else return window.pageXOffset;   
	},	
	getWindowWidth: function(){
		if (window.innerWidth)	return window.innerWidth; 
		if(document.documentElement && document.documentElement.clientWidth) return document.documentElement.clientWidth;
	},
	getDocumentWidth: function(){
		if (document.width) return document.width;
		if(document.body.offsetWidth) return document.body.offsetWidth;
	},
	initScroll: function(e){
		var targ;  
		if (!e) var e = window.event;
		if (e.target) targ = e.target;
		else if (e.srcElement) targ = e.srcElement;  
		targ = HtinyScrolling.getTarget(targ);  //a fix by Skid X
		HtinyScrolling.hash = targ.href.substr(targ.href.indexOf('#')+1,targ.href.length); 
		HtinyScrolling.currentBlock = document.getElementById(HtinyScrolling.hash);   
		if(!HtinyScrolling.currentBlock) return;
		HtinyScrolling.requestedX = HtinyScrolling.getElementXpos(HtinyScrolling.currentBlock); 
		HtinyScrolling.scroll(targ); 
		return false;
	},
	scrollToIt: function(targ){ //thanks to Michael Ionita-Ganea
		target = document.getElementById(targ);
		HtinyScrolling.currentBlock = document.getElementById(targ);
		if(!HtinyScrolling.currentBlock) return;
		HtinyScrolling.requestedX = HtinyScrolling.getElementXpos(HtinyScrolling.currentBlock);
		HtinyScrolling.scroll(target);
		return false;
 
	}, 
	scroll: function(targ) {
		var left  = HtinyScrolling.getScrollLeft();
		if(HtinyScrolling.requestedX > left) { //a fix by Michael Ionita-Ganea
			var endDistance = Math.round((HtinyScrolling.getDocumentWidth() - (left + HtinyScrolling.getWindowWidth())) / HtinyScrolling.brakeK);
			endDistance = Math.min(Math.round((HtinyScrolling.requestedX-left)/ HtinyScrolling.brakeK), endDistance);
			var offset = Math.min(Math.abs(Math.round((HtinyScrolling.requestedX-left)/ HtinyScrolling.brakeK)), HtinyScrolling.maxStep);
		}else {
				var offset = - Math.min(Math.abs(Math.round((HtinyScrolling.requestedX-left)/ HtinyScrolling.brakeK)), HtinyScrolling.maxStep);
		} 
		window.scrollTo(left + offset, 0);
		if(Math.abs(left-HtinyScrolling.requestedX) <= 1 || HtinyScrolling.getScrollLeft() == left) {
			HtinyScrolling.hash = null;
		} else 	setTimeout(HtinyScrolling.scroll,HtinyScrolling.speed);
	}
}
 
 
var scrollTips = {
	dx : null,
	init : function() {	
		if (window.addEventListener) {
		window.addEventListener("DOMMouseScroll", this.mouseScroll, false);
		} else document.attachEvent("onmousewheel", this.mouseScroll); 
		var left = document.getElementById('left');
		addEvent(left,'mouseover', function() {this.dx=setInterval('scrollTips.arrowScroll(0)',100);return false;});
		addEvent(left,'mouseout', function() { clearInterval(this.dx); return false;});
		var right = document.getElementById('right');
		addEvent(right,'mouseover', function() {this.dx=setInterval('scrollTips.arrowScroll(1)',100);return false;});
		addEvent(right,'mouseout', function() { clearInterval(this.dx); return false;});
	},
	mouseScroll : function(e) {
		if (!e) var e = window.event;
		  var scroll = e.detail ? e.detail * 20 : e.wheelDelta / -20;
		if (scroll>=0 ){  
		window.scrollBy(80,0);
		} else  window.scrollBy(-80,0) ; 
	},	
	arrowScroll: function(val) {
		if(val==1) {
			window.scrollBy(70,0);
		} else {
			window.scrollBy(-70,0)
		}
	}
}
 
 
function addEvent( obj, type, fn ) {
	if (obj.addEventListener)
		obj.addEventListener( type, fn, false );
	else if (obj.attachEvent) {
		obj["e"+type+fn] = fn;
		obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
		obj.attachEvent( "on"+type, obj[type+fn] );
	}
}
 
function removeEvent( obj, type, fn ) {
	if (obj.removeEventListener)
		obj.removeEventListener( type, fn, false );
	else if (obj.detachEvent) {
		obj.detachEvent( "on"+type, obj[type+fn] );
		obj[type+fn] = null;
		obj["e"+type+fn] = null;
	}
}
[HTML] pobierz, plaintext 

Ten post edytował spokoloko123 19.03.2012, 19:04:24

[kamil4u]

Zobacz w manualu co robi scrollToIt i zrób to sam
I jak Ci nie wyjdzie to pokaż jak próbowałeś i umieść link do skryptu.

[spokoloko123]

Spróbowałem wielu opcji i nic. Efekt podobny do poprzedniego (szarpnięcie) uzyskałem wywołując funkcję scroll(target). Napisałem nawet własną do pluginu

[HTML] pobierz, plaintext 
document.getElementsByTagName('a').onmouseover=function() {
	HtinyScrolling.init(); scrollTips.init();
}
[HTML] pobierz, plaintext 

Ale nie działa. Manuala nie znalazłem. Jest tylko http://lab.centralscrutinizer.it/the-tiny-scrollings/
Powracam do pytania:

Da się zrobić tak aby po najechaniu na link aktywować ten link a nie podmieniać URL?


Ten post edytował spokoloko123 19.03.2012, 20:08:26

[kamil4u]

Zamień link na: <a href="#home">Home</a> i w kodzie skryptu, który podałeś zamień w 21 linii click na mouseover

[spokoloko123]

Powiem tyle: Szkoda, że można dać tylko jedno pomógł. Wielkie dzięki )