L'accorciapagine

[Kurai]

Salve a tutti...
Purtroppo non sono molto esperto di javascript. Però mi sono trovato a dover mettere in un sito (si tratta di un sito di news) un sistema che accorgi i vari testi a tre-quattro righe con un tastino per espandere tutta la notizia.
Qualcuno mi può aiutare? non ho idea di come cominciare a fare una cosa del genere... basterebbe anche qualche script gratuito su internet, il fatto è che non so COSA cercare... "page shortener" non mi ha dato risultati utili... :|

Grazie in anticipo!

[br1]

Devi agire con script lato server... se indichi il linguaggio che supporta ti sposto sul forum relativo

ciao

[Kurai]

Originariamente inviato da br1
Devi agire con script lato server... se indichi il linguaggio che supporta ti sposto sul forum relativo

ciao

Argh... purtroppo sono su un server gratuito, e non ho al momento linguaggi supportati... Infatti uso blogger per le news... non c'è un sistema se non con linguaggi lato server? sapevo che con JS si poteva fare una cosa del genere...

[Kurai]

Nessuno ha idee?
Io ho provato così:
prima ho fatto due funzioni JS in questo modo:

function expand(obj){
eval("document.getElementById('"+obj+"').style.height ='auto'");
}
function chiudi(obj){
eval("document.getElementById('"+obj+"').style.height ='70px'");
}

Poi ho richiamato le funzioni dall'interno del div in cui si trova il corpo del testo:

espandi 
chiudi

Solo che così non riesce a "vedere" la differenza tra i vari post, che hanno tutti lo stesso id.
Allora ho pensato che bisognerebbe agire con l'id univoco del post fornito da blogger, magari associandolo a una variabile... ma non so come fare.... qualcuno mi aiuta a uscirne? sono sicuro che si può...

[Mich_]

Se ci sono piu` oggetti in una pagina con lo stesso ID e` un errore, che potrebbe avere effetti collaterali pesanti in qualche browser.

Comunque puoi passare l'oggetto e lavorare su quello.


Esempio (funziona solo in alcuni browser moderni):
<div ... style="height:4em;" onclick="exp_chi(this);">
Qui la tua notizia
</div>

dove la funzione exp_chi() e` di questo tipo:

function exp_chi(ogg) {
  if(ogg.style.height == 'auto') {
    ogg.style.height = '4em';
  } else {
    ogg.style.height = 'auto';
  }
}

Non la ho provata, per cui fallo tu.


Nota: la tua sintassi con eval() e` deprecata: la stessa cosa puoi ottenerla senza:
document.getElementById(obj).style.height ='auto';
dove obj contiene una stringa con l'ID dell'oggetto.

Ciao
Michele

[Kurai]

Originariamente inviato da Mich_
Se ci sono piu` oggetti in una pagina con lo stesso ID e` un errore, che potrebbe avere effetti collaterali pesanti in qualche browser.

Questa non la sapevo... vuoi dire che se io ho più

<div id="Newscorp">

, alcuni browser hanno problemi? Con quelli che ho provato io andava tutto bene.... per ovviare dovrei trasformarli in classi?

Esempio (funziona solo in alcuni browser moderni):
<div ... style="height:4em;" onclick="exp_chi(this);">
Qui la tua notizia
</div>
dove la funzione exp_chi() e` di questo tipo:

function exp_chi(ogg) {
  if(ogg.style.height == 'auto') {
    ogg.style.height = '4em';
  } else {
    ogg.style.height = 'auto';
  }
}

Una soluzione che funzioni in più browser e che mi permetta di controllare l'espansione tramite un link di testo o di immagine non c'è?

Edito: aggiungo che, usando blogger, posso risalire a un numero identifiacativo univoco del post attraverso il tag <$BlogItemNumber$>. Pensavo di utilizzare questo per capire il blocco da espandere, ma non ho idea di come fare...

[Sgnafurz]

provate qui
http://utenti.lycos.it/sgnafurz/prog...pandibile.html

testato solo su IE

[Mich_]

Originariamente inviato da Sgnafurz
provate qui
http://utenti.lycos.it/sgnafurz/prog...pandibile.html

testato solo su IE

Infatti in Mozilla non funziona

[Sgnafurz]

mi dai una mano a sistemarlo du mozilla?
non capisco perché si sovrappone il DIV al testo

[Mich_]

Originariamente inviato da Kurai
Questa non la sapevo... vuoi dire che se io ho più

<div id="Newscorp">

, alcuni browser hanno problemi? Con quelli che ho provato io andava tutto bene.... per ovviare dovrei trasformarli in classi? ...

Se usi un DTD strict, non vedi piu` i tuoi div con lo stesso nome. Lo stesso se il browser e` per dispositivi leggeri (non puo` correggere gli errori).
Comunque il primo effetto lo hai gia` visto: non sei in grado di indirizzare al div specifico.

Se ti serve un CSS comune a tutti, puoi usare una classe.

Indipendentemente dalla classe, puoi mettere un id ai tui div, pero` deve essere unico in ciascun documento (=file =pagina).

Esempio:
<div class="newscorp" id="Newscorp0">
Primo messaggio
</div>
<div class="newscorp" id="Newscorp1">
Secondo messaggio
</div>
...

Dentro il div (o anche fuori) puoi metterci i due bottoni come avevi fatto tu, ma devono passare come parametro l'ID del div che vuoi modificare.

Oppure puoi metterci il codice che ti ho dato io, che non necessita dell'ID (viene passato l'oggetto) - al primo click si espande, al secondo si riduce.

Puoi usare il click per espandere e ridurre come ho proposto prima, oppure puoi usare anche il mouseover/mouseout (non credo sia molto funzionale).
L'unico svantaggio e` che il click o mouseover/mouseout sui div non e` riconosciuto in tutti i browser, anche se e` previsto dal W3C (mi pare), per cui si presume che i nuovi browser lo riconosceranno tutti.


Nota: non so che programma usi per creare la pagina, ma tutti i linguaggi lato server sono in grado di generare i nomi con un numero progressivo.

Ciao
Michele