Come creo un <div> con altezza variabile?

[esacerbare]

Ho un div in cui é contenuto un articolo che vorrei che fosse di 200px a defuault e come altezza minima mentre tutta la lunghezza disponibile quando l'utente decide di leggere tutta la notizia. Inoltre vorrei anche una scritta in blu del tipo:
"Leggi la notizia completa" che scompaia non appena ci clicco sopra ed una seconda indicazione del tipo "Chiudi articolo". Qualcuno mi aiuta a cercare questo esempio su html.it che sono certo esistere già!

Se non trovate nulla mi dite quali comandi di javascript dovrei utilizzare?

Grazie come sempre

[br1]

Per la prima parte della domanda devi usare i CSS (altra sezione del forum) al quale ti rimando per la ricerca.

Esempio didattico per la seconda parte

<script>function $(s){return document.getElementById(s)}</script>

<div id="attivatore">
  Leggi la notizia
</div>
<div id="contenuto" style="display:none;">
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  Chiudi la notizia
</div>

ciao

[esacerbare]

Miseria che rapidità, meglio non si poteva pretendere...

Io ho risolto il problema con jquery in questo modo:

// JavaScript Document
jQuery.noConflict();
function incrementa() {jQuery(".articoli_contenuto").css("height","auto" );}
function decrementa() {jQuery(".articoli_contenuto").css("height","120px ");}

però c'é un nuovo problema che sorge spontaneo:
siccome questa particolare funzione vorrei implementarla su di un blog i cui articoli hanno tutti la stessa classe mi chiedevo se c'era la possibilità di far funzionare il codice per un div con class X contenente lo stesso e SOLO bottone o link cliccato.

Grazie di cuore br1!

[esacerbare]

Il tuo codice é molto più carino e anche più leggero però ho una domanda che non mai capito:
che cosa fa il codice "return false"?
Con che criterio usi:
1) return
2) return false
3) return true
?

Grazie mille!

[esacerbare]

Ho applicato il tuo codice a pensieri diversi dal primo però noto che la parte aggiunta da javascript in automatico viene messa a capo. In pratica vorrei che i pensieri aggiunti seguano il pensiero precedente senza andare a capo.

Esempio attuale (dopo aver cliccato):

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla.

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla.

Esempio che vorrei che si verificasse (dopo aver cliccato):

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla. Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla.

Ho provato a non usare il div bensi lo span oppure il p ma non sono riuscito a combinare nulla.

Grazie

[esacerbare]

up!

[esacerbare]

up!