Printable View
Salve a Tutti
nel mio sito ho una pagina (impaginazione con tabella) nella quale ho all'interno di un td un testo....volevo creare una cosa del tipo...al click sul testo compare un c'erto tr....se clicco su un'altra parola del testo ne compare un altro e così via....come posso fare? grazie 1000 in anticipo
hai già abbozzato qualcosa se si postamelo che vedo ... ciao
no...non ho la più pallida idea di come io possa fare :)
Non voglio fare spam, ma prova a vedere sul mio sito nella sezione meteo, se è quello che cerchi.
PS. non metto il link per non generare spam.
non proprio...ma una cosa più simile a questa (in alto a destra dove c'è la freccia con scritto espandi) solo che invece di una immagine ho una scrittaCitazione:
Originalmente inviato da australiafever
Prova a cercare su Google ad esempio "div a comparsa" e poi quello che trovi lo adatti alla tabella.
Se vuoi comprimere/espandere del contenuto, è conveniente mostrarlo per default, e renderlo invisibile. Poi, quando lo vuoi mostrare, cambi proprietà css tramite js: così, anche chi non ha javascript, può vedere il contenuto. Una cosa del tipo:
Non usare le tabelle per i contenuti!Codice HTML:<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>prova</title>
</head>
<body>
<button onClick="toggla()">mostra/nascondi</button>
<div id="contenuto">
contenuto che si vedrà solo se si preme il pulsante...
</div>
<script type="text/javascript">
window.onload = function()
{
document.getElementById('contenuto').style.display="none";
}
function toggla()
{
var elemento = document.getElementById('contenuto');
if(elemento.style.display == 'none')
{
//l'elemento è nascosto. Lo mostriamo!
elemento.style.display = 'block';
}
else
{
//l'elemento è visibile: lo nascondiamo!
elemento.style.display = 'none';
}
}
</script>
</body>
</html>
Ciao!
e se vuoi usare ancora meno codice per mostrare e nascondere un elemento (ma non utilizzare il tr della tabella come gia ti anno suggerito) utilizza la libreria jquery:
Codice HTML:<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").toggle();
});
});
</script>
</head>
<body>
<p>ciao mondo</p>
<button>mostra/nascondi</button>
</body>
</html>
Meno codice, ma includendo un file di alcuni kB :mrgreen:.
Se si include jQuery, a questo punto forse è più bello usare .animate().
Ciao!
con la speranza che in internet non girino ancora pentium I, jquery non dovrebbe essere troppo pesante neanche con dispositivi mobile... cmq volevo solo dare un'alternativa.
no ma hai fatto benissimo!
Ciao!
ok grazie a tutti