Dal titolo forse non si capisce, ma è possibile fare in modo che un
DIV in position: ABSOLUTE, sia imprigionato in TOP: 0; relativamente ad una parte della pagina?
Cioè aver un div absolute (sopra a tutto!) che in top 0 risulti non al margine superiore della pagina, ma al margine superiore di una td in basso alla pagina, in modo da poter settare con javascript il top -100!
Grazie infinite!!
uhm, non è chiarissimo
sposto in CSS
Spiego tutto il problema:
sappiamo che la risoluzione dello schermo può essere diversa da utente ad utente, così anche la grandezza della finestra;
se io una pagina con soltanto una table centrata (sia in altezza che in larghezza) sulla pagina (quindi in verità ne sarebbero due) di altezza 200 con un div in position absolute; questo div contiene un'altro table, di cui la prima td è alta 150 e contiene del testo, mentre la seconda è alta 50 e contiene un'altro div che se cliccato dovrebbe modificare la sua altezza in 200 e trovarsi proprio sopra al testo della prima td!
Se è possibile gestire questa soluzione mi eviterei tortuosi calcoli per rilevare la grandezza della finestra, etc. per poi settare normalmente il top in position absolute rispetto l'intera finestra.
dovresti rifare la pagina senza tabelle e così ci sarebbe più senso nel discorso
posta la pagina in questione e spiega meglio
Le tabelle ci sono perchè la mia pagina seve comparire al centro dell'altezza della finestra quindi:
Quindi mi chiedo se è possibile farlo in css/html anzichè magari in javascript con il ricavarsi della posizione dell'oggetto!Codice PHP:<html>
<head>
</head>
<body>
<table width="100%" style="height: 100%;">
<tr>
<td height="100">
<table width="100">
<tr>
<td>
<DIV style="position: absolute; height: 100; width: 100;">
<table width="100">
<tr>
<td>
<DIV id="div_com" style="height: 20; width: 100;" ondblclick="Javascript: esp(event);">
--------AMPIA IL DIV-----------
</DIV>
</td>
</tr>
<tr>
<td>
<DIV id="div_esp" style="height: 80; width: 100;">
</DIV>
</td>
</tr>
</table>
</DIV>
</td>
</tr>
</table>
</td>
</tr>
</table>
<SCRIPT>
function esp() {
document.getElementById("div_com").top= "si dovrebbe fare in modo che div_com aquisisca un posizione più in alto di es. 100px";
document.getElementById("div_esp").top= "si dovrebbe fare in modo che div_esp aquisisca un posizione più in alto di es. 100px";
}
</SCRIPT>
</body>
</html>
L'idea era quella, appunto, di fare in modo che il div riconoscesse il top:0 relativamente alla tabella in cui è imprigionato, in modo da porterlo settare poi con un -100px.
...Non so se è possibile!
Grazie ancora!!
UP!
la parola position potrebbe tornarmi utile?;P
Con le tue risposte ti metti fuori gioco da solo ...
Quando dopo che ti e` stato consigliato di eliminare le tabelle esci con la frase:nessuno ci prova piu` ad aiutarti.Le tabelle ci sono perchè la mia pagina seve comparire al centro dell'altezza della finestra
Il centramento di un oggetto non si fa piu` con le tabelle da molti anni, e il forum e` pieno di risposte in tal senso (con riferimenti anche tra i "link utili").
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
Fermandosi al problema e cercando di risolverlo con la tua soluzione, per quanto come ti è stato detto sia discutibile, e volendo centrare il contenuto e avere al doppio click uno spostamento del div più in alto
cioè elimini un po' di cose inutili fra div e tabelle, metti un div con posizionamento relativo nella cella e al suo interno il div che deve spostarsi con posizionamento assoluto.codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <title>titolo</title> <style type="text/css"> * { margin:0; padding:0; border:0;} html, body { height:100%; margin:0; padding:0;} #table1, #table1 #td1{ height:100%; } </style> </head> <body> <table id="table1" style="background-color:red"> <tr> <td id="td1"> <table style="background-color:yellow"> <tr> <td> <div style="position: relative;"> <div id="div_com" style="height: 20px; width: 100px;background-color:green;position:absolute;top:0" ondblclick="javascript: esp();"> --------DOPPIO CLICK FA SALIRE IL DIV----------- </div></div> </td> </tr> <tr> <td> <div id="div_esp" style="height: 80px; width: 100px;"></div> </td> </tr> </table> </td> </tr> </table> <script type="text/javascript"> function esp() { document.getElementById('div_com').style.top= -100 +"px"; document.getElementById('div_esp').style.top= -100 +"px"; } </script> </body> </html>
Permessi di invio
Rispondi quotando