News verticali dinamiche con scroll

27 08 2007

In un sito può essere molto importante far vedere al visitatore le ultime news con link e una piccola descrizione del contenuto.

Ecco delle News verticali dinamiche realizzate in Flash, sarà possibile scorrerre le varie news tramite uno scroll, inserire link, testo e adoperare un foglio di stile .css esterno.

News verticali dinamiche con scroll

Come al solito andiamo a vedere insieme il file .XML che ci servirà per inserire nuove news:

<item>
<titolo>Ken il Guerrero - cortometraggio 3D</titolo>
<testo>Se siete appassionati del cartone manga giapponese Ken il guerrero e di animazioni 3D questo video vi farà molto piacere.</testo>
</item>

  • titolo: Inserire il titolo della news, può essere anche inserito un link tramite il tag href
  • testo : Inserire il testo della news, possono essere inseriti i vari tag grassetto, italico, sottolineato

Le news possono essere semplicemente incapsulate in un altro file SWF tramite la funzione loadMovie

Scarica il sorgente
Guarda il Tutorial


Azioni

Informazione

39 risposte

27 08 2007
Motta

julius, tutte le colonna orizzontali le possiamo dividere a loro volta in due colonne verticali?

esempio

| notizia 1a (img?) | norizia 1b (testo) |
| notizia 2a (img?) | norizia 2b (testo) |
| notizia 3a (img?) | norizia 3b (testo) |

ecc. ecc. ?

27 08 2007
Julius

Potresti duplicare il campo dinamico e fare qualche cambiamento al codice…credo sia possibile…

Oppure provare a inserire una tabella o div, in quanto il campo di testo è HTML compatibile..fai delle prove…

29 08 2007
Milo

Ciao Julius.Come va?Hai passato bene le vacanze?
adesso la domanda:
ma come mai inserendo il file .swf in una pagina htm non viene visualizzato nulla?premetto che tutti i file dei tuoi news si trovano nella stessa cartella

grazie

29 08 2007
Julius

Ciao Milo tutto bene grazie :)

Molto strano il tuo problema…inserisci un link alla tua pagina html che verifico

PS: se hai utilizzato la mia stessa pagina HTML ti mancherà il file .js :P

29 08 2007
Milo

Ciao.non ho un sito web,ma dicevo con dreamweaver.
ad esempio: ho la mia html ecc. nella stessa cartella metto la Tua cartella e nella html prrincipale non vierne visualizzato nulla,solo background,ma senza notizie.
sicuramente è il problema di percorso….

1 09 2007
lorexx

ciao Julius vorrei inserire all’interno delle news delle immagini, ho provato modificando il file xml ma non inserisce nulla. aspetto una tua illuminante risposta.

ciao lorexx

1 09 2007
Julius

@Milo come ti ho detto prima, se inserisci un link nei commenti della tua pagina posso verficare e trovare l’errore..cosi a parole non so che dirti…

@lorexx ciao,

prova inserire un immagine nel file xml con i tag <img src=”" …..

1 09 2007
lorexx

grazie Julius, già provato

nada nn vuole caricarla.

p.s: per cambiare il colore della scroll bar che devo fà.

thnx lorexx

1 09 2007
Napolux

Bello il plugin per visualizzare il codice… Come si chiama?

2 09 2007
Julius

@lorexx ciao,

inviami il tuo progetto alla mail che vedo il problema, per cambiare il colore, devi entrare nel progetto .fla

@Napolux ciao, è una classe del template, la puoi trovare qui: Classe code

7 09 2007
vale

ciao!Un altro utilissimo elemento per i nostri siti..grazie!La mia domanda è da neofita dei css e sembrerà piuttosto banale ma..come posso personalizzare l’aspetto di questo scroller?Magari inserendo un’immagine come cornice o come top/bottom?
grazie mille!

9 09 2007
12 09 2007
danno

ti ho trovato per caso e mi hai salvato, con i tuoi tutorial… credo che verrò spesso nel tuo blog.

grazie!!!!!!

14 09 2007
danno

Ciao sono una tua nuova fans, ma sono brava a complicarmi la vita… ho preso il tuo esempio di news verticale, favoloso lo sto studiando… ma volevo mettere al posto della scroll bar le freccine che vanno su e giù… e qui il problema di unire le cose, il guaio è che tu hai dato un nome al testo ‘news’ e le mie freccie si collegano alla var del testo, e io non so come cambiare i comandi… ti faccio vedere quello che ho:
on (release, keyPress “”) {
scr = testo.scroll;
if (scr>1) {
testo.scroll = scr-1;
}
scroll = testo.scroll;
maxscroll = testo.maxscroll;
}

se non ti rompe mi puoi aiutare….
se no non importa… grazieee

17 09 2007
SPiKE

ciao julius!
ma si possono mettere,al posto dei link ad altre pagine,link a swf esterni?
in che modo?
grazie! :)

17 09 2007
Julius

Al posto della funziona getURL metti la funzione laodMovie riferita a un tuo swf che verrà cariato in un clip contenotore

21 09 2007
molten72

Scusa Julius,
anche io tempo fa ti avevo chiesto questa cosa, ma purtroppo non sono riuscito a capire questo benedetto getUrl dove sta.
Nell’xml,no.
Nel primo frame,no:
//Formato CSS
_global.formatoCSS = new TextField.StyleSheet();
_global.archivioCSS = “stile_news.css”;
formatoCSS.load(archivioCSS);

21 09 2007
molten72

…continuo…

nel testo dinamico,no:
// –
news.autoSize = true;
news.html = true;
news.htmlText = “Sto caricando..”;
news.styleSheet = formatoCSS;
// –
var nNews:XML = new XML();
nNews.ignoreWhite = true;
nNews.load(’news.xml’);
nNews.onLoad = function() {
news.htmlText = “”;
qtd = this.childNodes[0].childNodes.length;
for (i=0; i<qtd; i++) {
var nTitolo = (this.childNodes[0].childNodes[i].childNodes[0]);
var nTesto = (this.childNodes[0].childNodes[i].childNodes[1]);
news.htmlText += “”+nTitolo+”"+nTesto+”- – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – -”;
}
};

…forsemi sfugge?
scusami tanto.
Grazie mille

21 09 2007
Julius

Allora ho sbagliato io, mi sono confuso =P

i link sono presenti nel file news.xml sotto forma di collegamenti ipertestuali con il tag href

Quindi nn è possibile utilizzare la funziona getURL in quanto i collegamenti vengono gestiti tramite tag HTML.

Cerco di inventarmi qualcosa…

23 09 2007
molten72

Grazie mille Julius,
devi avere proprio una bella pazienza!!!
Attendo tue notizie,
CIAO

7 10 2007
molten72

Ciao Julis,
sto crecando da giorni di inventarmi qualcosa!!!
… ma niente!!!
Ti prego ILLUMINAMI !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
GRAZIE ANCORA

22 10 2007
PAOLO

Ciao Julius, una domanda …

è possibile giustificare il testo contenuto nel file xml ?

Grazie

Paolo

25 10 2007
PAOLO

Ciao julius, hai letto il mio ultimo post a rigurdo del testo giustificato ?

Grazie !

Paolo

30 10 2007
savanna

ciao Julius, complimenti per i tuoi bellissimi lavori molto utili per imparare e non solo copiare!
volevo chiederti se è possibile aprire una popup al posto di un collegamento ad una pagina html (questo perchè vorrei inserire un’immagine per ogni testo cliccabile)….grazie.
ciao

25 11 2007
gabriele

Ciao Julius,
posso chiederti come mai quando clicco sui titoli invece di aprirmi la pagina, mi viene fuori un avviso di sicurezza di Flash Player che mi dice di cambiare le impostazioni?
Altra domanda: per cambiare il testo (colore, font) devo modificare il css?

25 11 2007
Julius

@PAOLO in teoria il testo è codificato in HTML quindi dovresti poterlo formattare facilemente

@savanna ciao usa lo stesso procedimento come viene descritto in Apertura popup da Flash

@gabriele ciao

per la prima domanda: In poche parole provi applicazione flash in locale…qualora tu voglia disabiltiare la sicurezza leggi Abilitare il contenuto Flash in locale

Per il colore devi modificare il parametro nel CSS

27 11 2007
savanna

grazie julius,
volevo chiederti un’altra cosa …secondo te è possibile associare ad ogni titolo cliccabile ad esempio un file pdf da scaricare?
grazie ancora.

27 11 2007
Julius

al posto del link a una pagina inserisci il percorso del file pdf

In questo modo certi browser aprono il file altri lo fanno scaricare

se vuoi essere sicura li “zippi” è linki a un file .Zip con la sicurezza che il file venga scaricato senza essere aperto prima.

27 11 2007
savanna

grazie julius! sei davvero un ottimo maestro ed è un piacere imparare e prendere spunti dai tuoi preziosi esempi.

27 11 2007
Julius

Ti ringrazio :P

un saluto

3 01 2008
Gianluca

Ciao, innanzitutto complimenti per il sito ed i tuoi lavori. Sto cercando di capire come richiamare in flash un file xml e mi sono messo a studiare il sorgente di questo tuo script che apprezzo veramente molto. C’è una cosa che non capisco e vorrei chiederti info se possibile.

Hai un xml con un nodo di nome menù, che contiene un nodo figlio di nome item, che a sua volta contiene due nodi figli di nome titolo e testo. Fin qui tutto ok.

Ora ti riporto la parte di codice che non capisco e che richiama questo xml


qtd = this.childNodes[0].childNodes.length;
for (i=0; i<qtd; i++) {
var nTitolo = (this.childNodes[0].childNodes[i].childNodes[0]);
var nTesto = (this.childNodes[0].childNodes[i].childNodes[1]);

L’attributo length a cosa serve?
Vorrei capire bene cosa significano le lettere i all’interno delle paretensi quadre, stessa cosa per ilo numero 1.

E se volessi aggiungere che so un ulteriore nodo chiamato immagine? Come lo richiamo?

Se riesci a chiarirmi questi concetti ti sarei grato davvero.

3 01 2008
Julius

lenght restituisce la lunghezza di un qualcosa, in questo caso del nodo

Il ciclo non fa altro che leggere tutte le informazioni nei nodi…

Se vorresti aggiungere un altro nodo ti basterà inserire un’altra stringa di codice identica a quelle aumentando il childNodes[2]

3 01 2008
Gianluca

Ho capito il significato del numero
Ma la i cosa significa?

3 01 2008
Gianluca

Ho capito, non avevo fatto caso che l’avevi specificata nel ciclo…

15 01 2008
Giuseppe

Ciao Julius, complimenti per il tutorial, ho provato ad inserire un immagine con il tag prima nell’xml e poi anche nel fla, ma nulla, puoi darmi una mano?

22 01 2008
rosario

salve,

io ho modificato il for aggiungendo un tag all’xml contenente img src , la foto si vede il problema è che l’html perde la formattazione ho provato in vari modi fino a creare una table ma niente quando si carica l’img il secondo messavggio si accavalla come se non leggesse il br…!!

come fare

Grazie

for (i=0; i<qtd; i++) {
var nTitolo = (this.childNodes[0].childNodes[i].childNodes[0]);
var nPhoto = (this.childNodes[0].childNodes[i].childNodes[1]);
var nTesto = (this.childNodes[0].childNodes[i].childNodes[2]);
news.htmlText += “”+nTitolo+”"+nPhoto+”"+nTesto+”";
}

24 01 2008
sole

cioa julius, mi chiedevo se fosse possibile inserire un rigo per la data e fare in modo che le news venissero visualizzate in base all’ultima inserita e quindi la più recente. grazie in anticipo.

31 01 2008
stanislao

Ciao,
è un bellissimo metodo news, io vorrei utilizzarlo con l’inserimento, oltre che del testo con link, anche di immagini in miniatura che si trovano in una cartella thumb, ma non capisco come posso fare…
sapreste aiutarmi?
grazie…

1 02 2008
stanislao

ciao, qualcuno è riuscito a inserire oltre al testo con link anche delle immagini?
grazie
stanislao

Lascia un commento

Occorre aver fatto il login per inviare un commento