fissare un layer e non farlo muovere

**Meta-tag** · 27-08-2005, 16:01

Ho un layer che voglio far vedere solo per chi ha la risoluzione da 1024 in poi perche' altrimenti se si usa l'800 per 600 entra nel pieno della pagina web.
Ora sto usando questo:

codice:

<div id="object1" style="width: 183px; height: 345px; left: 0px; top: 84px">

cosa devo cambiare per spostarlo dove dico io sul lato sinistro e fissarlo la'?
Mi spiego meglio:
sto layer si trova fuori dal layout della pagina, se l'utente ha la risoluzione da 1024 in poi lo deve vedere, mentre se ha la risoluzione 800 per 600 non deve vederlo.
Cosa cambio???

**Petro_suse91** · 27-08-2005, 16:05

prova
style="position:absolute;right:0px"

però attenzione che così te lo "fissa" sia in orizzontale che in verticale, e sarà sempre a 0 pixel dal margine dx. Quindi attenzione che potrebbe coprire dei contenuti.

**Meta-tag** · 27-08-2005, 16:16

Originariamente inviato da Petro_suse91
prova
style="position:absolute;right:0px"

però attenzione che così te lo "fissa" sia in orizzontale che in verticale, e sarà sempre a 0 pixel dal margine dx. Quindi attenzione che potrebbe coprire dei contenuti.

tu dici cosi'?

codice:

<div id="object1" style="position:absolute;right:0px height: 345px; left: 0px; top: 84px">

**Zero** · 27-08-2005, 16:19

Mmmm.. potresti provare con una soluzione javascript:

codice:

<html>
<head>
<title>Test</title>
<script>
function test(){
var s_width ='';
var s_height ='';
s_width=screen.width
s_height=screen.height

if (s_width == "640"){
 document.getElementById("tuodiv").style.display="none";
}

if (s_width == "800"){
 document.getElementById("tuodiv").style.display="none";
}

if (s_width == "1024"){
document.getElementById("tuodiv").style.display="block";
}

if (s_width == "1280"){
 document.getElementById("tuodiv").style.display="block";
} 
}
</script>
</head>

<body onload="test();">
<div id="tuodiv" style="width:200px;height:200px;border:1px solid #000;display:none;"></div>
</body>
</html>

**Petro_suse91** · 27-08-2005, 16:19

ehm... quasi.

innanzitutto devi mettere ; dopo right:0px
e poi devi cancellare la direttiva left:0px
non può stare a 0 pixel sia dal margine destro che da quello sinistro, non ti pare?

edit: zero: non è conveniente usare javascript per la visualizzazione, meglio i fogli di stile

te lo dico perchè l'ho usati anch'io e ora li sto abbandonando, in favore di una soluzione più compatibile

**Meta-tag** · 27-08-2005, 16:25

Originariamente inviato da Petro_suse91
ehm... quasi.

innanzitutto devi mettere ; dopo right:0px
e poi devi cancellare la direttiva left:0px
non può stare a 0 pixel sia dal margine destro che da quello sinistro, non ti pare?

edit: zero: non è conveniente usare javascript per la visualizzazione, meglio i fogli di stile

te lo dico perchè l'ho usati anch'io e ora li sto abbandonando, in favore di una soluzione più compatibile

ho provato ma non va...

**Meta-tag** · 27-08-2005, 16:26

Originariamente inviato da Zero
Mmmm.. potresti provare con una soluzione javascript:

codice:

<html>
<head>
<title>Test</title>
<script>
function test(){
var s_width ='';
var s_height ='';
s_width=screen.width
s_height=screen.height

if (s_width == "640"){
 document.getElementById("tuodiv").style.display="none";
}

if (s_width == "800"){
 document.getElementById("tuodiv").style.display="none";
}

if (s_width == "1024"){
document.getElementById("tuodiv").style.display="block";
}

if (s_width == "1280"){
 document.getElementById("tuodiv").style.display="block";
} 
}
</script>
</head>

<body onload="test();">
<div id="tuodiv" style="width:200px;height:200px;border:1px solid #000;display:none;"></div>
</body>
</html>

forse cosi' potrebbe andare, ma il div scende insieme alla pagina quando scrollo.
Ho gia' il codice, come lo incorporo?

codice:

<script language="JavaScript" type="text/javascript">
<!--
function setVariables(){
	px="+'px'";
	if (navigator.appName == "Netscape") {
		if (parseInt(navigator.appVersion) >= 5){
			v=".top=";
			h=".left=";
			dS="document.getElementById(\"";
			sD="\").style";
			y="window.pageYOffset";
			x="window.pageXOffset";
		}
		else {
			v=".top=";
			h=".left=";
			dS="document.";
			sD="";
			y="window.pageYOffset";
			x="window.pageXOffset";
			px="";
		}
	}
	else {
		var validDoc=(document.compatMode && document.compatMode != "BackCompat")?1:0;
		h=".left=";
		v=".top=";
		dS="";
		sD=".style";
		y=(validDoc)?"document.documentElement.scrollTop":"document.body.scrollTop";
		x=(validDoc)?"document.documentElement.scrollLeft":"document.body.scrollLeft";
	}
	checkLocationA()
}

 movex=0,movey=0,xdiff=0,ydiff=0,ystart=0
,xstart=0

function checkLocation(){
	object="object1";
	yy=eval(y);
	xx=eval(x);
	ydiff=ystart-yy;
	xdiff=xstart-xx;
	if ((ydiff<(-1))||(ydiff>(1))) movey=Math.round(ydiff/10),ystart-=movey
	if ((xdiff<(-1))||(xdiff>(1))) movex=Math.round(xdiff/10),xstart-=movex
	if (ystart>=83){
		eval(dS+object+sD+v+(ystart+10)+px);
	} else {
		eval(dS+object+sD+v+83+px);
	}

	eval(dS+object+sD+h+xstart+px);
	setTimeout("checkLocation()",10);
}

function checkLocationA(){
	ystart=eval(y);
	xstart=eval(x);
}

//-->
</script>

**Zero** · 27-08-2005, 16:28

Originariamente inviato da Petro_suse91
edit: zero: non è conveniente usare javascript per la visualizzazione, meglio i fogli di stile

te lo dico perchè l'ho usati anch'io e ora li sto abbandonando, in favore di una soluzione più compatibile

Concordo

solo che stavo per postare la tua stessa soluzione (poi, fortunatamente, ho riguardato la pagina prima di inviare il post) e quindi ho pensato di inviare "un'alternativa"

Premettendo che sono il primo a creare siti a layout liquido, basati su (x)html (strict) e css, credo che, alle volte, l'utilizzo di js possa essere utile; dipende dalla situazione

Naturalmente: Imho

**Zero** · 27-08-2005, 16:33

Originariamente inviato da Meta-tag
forse cosi' potrebbe andare, ma il div scende insieme alla pagina quando scrollo.
Ho gia' il codice, come lo incorporo?

Basterebbe aggiungere la funzione alle tue

codice:

<script language="JavaScript" type="text/javascript">
<!--

function invis(){
var s_width ='';
var s_height ='';
s_width=screen.width
s_height=screen.height

if (s_width == "640"){
 document.getElementById("tuodiv").style.display="none";
}

if (s_width == "800"){
 document.getElementById("tuodiv").style.display="none";
}

if (s_width == "1024"){
document.getElementById("tuodiv").style.display="block";
}

if (s_width == "1280"){
 document.getElementById("tuodiv").style.display="block";
} 

}

function setVariables(){
	px="+'px'";
	if (navigator.appName == "Netscape") {
		if (parseInt(navigator.appVersion) >= 5){
			v=".top=";
			h=".left=";
			dS="document.getElementById(\"";
			sD="\").style";
			y="window.pageYOffset";
			x="window.pageXOffset";
		}
		else {
			v=".top=";
			h=".left=";
			dS="document.";
			sD="";
			y="window.pageYOffset";
			x="window.pageXOffset";
			px="";
		}
	}
	else {
		var validDoc=(document.compatMode && document.compatMode != "BackCompat")?1:0;
		h=".left=";
		v=".top=";
		dS="";
		sD=".style";
		y=(validDoc)?"document.documentElement.scrollTop":"document.body.scrollTop";
		x=(validDoc)?"document.documentElement.scrollLeft":"document.body.scrollLeft";
	}
	checkLocationA()
}

 movex=0,movey=0,xdiff=0,ydiff=0,ystart=0
,xstart=0

function checkLocation(){
	object="object1";
	yy=eval(y);
	xx=eval(x);
	ydiff=ystart-yy;
	xdiff=xstart-xx;
	if ((ydiff<(-1))||(ydiff>(1))) movey=Math.round(ydiff/10),ystart-=movey
	if ((xdiff<(-1))||(xdiff>(1))) movex=Math.round(xdiff/10),xstart-=movex
	if (ystart>=83){
		eval(dS+object+sD+v+(ystart+10)+px);
	} else {
		eval(dS+object+sD+v+83+px);
	}

	eval(dS+object+sD+h+xstart+px);
	setTimeout("checkLocation()",10);
}

function checkLocationA(){
	ystart=eval(y);
	xstart=eval(x);
}

//-->
</script>

E poi richiamarla all'onload del body, così

codice:

<body onload="invis();">

Ricorda di cambiare "tuodiv" (nella funzione js) con l'id del tuo div

Ciao

**Meta-tag** · 27-08-2005, 16:38

Originariamente inviato da Zero
Basterebbe aggiungere la funzione alle tue

E poi richiamarla all'onload del body, così

[CODE]
<body onload="invis();">
[/code

Ciao

il mio body e' un po' incasinato per le altre funzioni.
come metto la tua?

codice:

<body style="background-color:#C8E7FF;background-image: url(fig/sfondo.jpg);background-position: top left;background-repeat: repeat-x;text-align:center;margin: 0px 0px;" onLoad="setVariables();checkLocation()">

Discussione: fissare un layer e non farlo muovere

Strumenti discussione

Ricerca discussione

Visualizza

fissare un layer e non farlo muovere

Permessi di invio