bottone che scrolla giu' la pagina onmouseOver

**dilemboGiovanni** · 24-09-2004, 21:52

Ciao sto cercando di creare un bottone che mi consenta di scrollare su, giu a dx e sx la pagina senza usare le scrollbar....
Mi piacerebbe in pratica agganciare all'enevto onmouseover di un bottone l'azione scroll down, up, right e left...ma nn so da dove iniziare
Qualche aiuto

Grazie

**badaze** · 25-09-2004, 10:56

Prova questo (funziona con IE 6.0)

codice:

<HTML>
<HEAD>
	<TITLE>Selezione da una lista digitando i caratteri in un TextBox</TITLE>
<HEAD>
<style type="text/css">
<!--
.inverted {color:white;background-color:navy} 
-->
</style>

<SCRIPT>
<!--
var previousRow = null;
function find() {
 if (previousRow != null) {
  previousRow.className = "";
 } // if (previousRow != null)
 stringToFind = document.getElementById('input1').value;
 stringToFind = stringToFind.toLowerCase();
 rows         = document.getElementById('stati').rows.length;
 for (i=0;i<rows;i++) {
  currentRow = document.getElementById('stati').rows.item(i)
  cells = currentRow.cells.length;
	//------------ si assume che la colonna da controllare sia la prima ovvero (1 - 1) = 0
	controlledCell = 0
	for (j=0;j<cells;j++) {
	 currentCell     = currentRow.cells.item(controlledCell);
	 currentCellText = currentCell.innerHTML;
	 currentCellText = currentCellText.toLowerCase();

	 if (stringToFind <= currentCellText) {
	  currentRow.className = "inverted";
		previousRow          = currentRow;
		document.getElementById('container').scrollTop = currentRow.offsetTop;
		return;
	 } // if (stringToFind <= currentCellText) 
	} // for (j=0;j<cells;j++)
 } //  for (i=0;i<rows;i++
 alert("non trovato");
} // function find()


var stopScrollUp   = true;
var stopScrollDown = true;
var scrollStep     = 5;

function pippo() {
 if (! stopScrollUp) {
  scrollUp();
 } // if (! stopScrollUp)
 if (! stopScrollDown) {
  scrollDown();
 } // if (! stopScrollDown)
} // function pippo()

window.setInterval("pippo()",10);

function scrollUp() {
 if (document.getElementById('container').scrollTop > 0) {
  document.getElementById('container').scrollTop -= scrollStep;
 } else {
  document.getElementById('container').scrollTop = 0;
	return;
 } // if (document.getElementById('container').scrollTop > 0)
} // function scrollUp()


function scrollDown() {
 if (document.getElementById('container').scrollTop <= document.getElementById('stati').offsetHeight - document.getElementById('container').offsetHeight) {
  document.getElementById('container').scrollTop+= scrollStep;
 } else {
  document.getElementById('container').scrollTop = document.getElementById('stati').height;
	alert('max');
	return;
 } // if (document.getElementById('container').scrollTop < document.getElementById('stati').height)
} // function scrollDown()

function stopScroll() {
 stop = true;
} // function stopScroll()

//-->
</SCRIPT>

</HEAD>
<BODY id="body" BGCOLOR="#ffffff" onmouseover="document.getElementById('status').innerHTML = window.event.srcElement.id;">
<FORM NAME="modulo">
<INPUT TYPE="text" NAME="input1" ID="input1" VALUE="Scrivi..." CLASS="" > 
<INPUT TYPE="button"  VALUE="Cerca" onclick="find()" >


 <DIV ID="container" 
   STYLE="height:200px; width:150;z-index=100;font-family:verdana;font-size:9pt;overflow: auto;">
	<TABLE id="stati" NAME="stati" BORDER="1">
<TR><TD>Albania</TD></TR>
<TR><TD>Cayman Islands</TD></TR>
<TR><TD>Central African Rep.</TD></TR>
<TR><TD>Chad</TD></TR>
<TR><TD>Chile</TD></TR>
<TR><TD>China</TD></TR>
<TR><TD>Christmas Island</TD></TR>
<TR><TD>Gambia</TD></TR>
<TR><TD>Georgia</TD></TR>
<TR><TD>Germany</TD></TR>
<TR><TD>Ghana</TD></TR>
<TR><TD>Gibraltar</TD></TR>
<TR><TD>Great Britain (UK)</TD></TR>
<TR><TD>Greece</TD></TR>
<TR><TD>Greenland</TD></TR>
<TR><TD>Grenada</TD></TR>
<TR><TD>Guadeloupe (Fr.)</TD></TR>
<TR><TD>Guam (US)</TD></TR>
<TR><TD>Guatemala</TD></TR>
<TR><TD>Guinea</TD></TR>
<TR><TD>Guinea Bissau</TD></TR>
<TR><TD>Guyana</TD></TR>
<TR><TD>Italy</TD></TR>
<TR><TD>Ivory Coast</TD></TR>
</TABLE>
</div>
<input type="button" id="up" value="Up" onmouseover="stopScrollUp=false" onmouseout="stopScrollUp=true">
<input type="button" id="down" value="Down" onmouseover="stopScrollDown=false" onmouseout="stopScrollDown=true">


<div id="status"></div>
</FORM>

</BODY>
</HTML>

Discussione: bottone che scrolla giu' la pagina onmouseOver

Strumenti discussione

Ricerca discussione

Visualizza

bottone che scrolla giu' la pagina onmouseOver

Permessi di invio