Far scorrere delle scritte in un simil-form

Buonasera a tutti
Io vorrei mettere delle scritte per inserire delle news scorrevoli in senso longitudinale in un riquadro di una pagina web.
Praticamente...volendo essere piu' chiaro, io vorrei poter fare in modo di avere dei piccoli titoli di coda racchiusi in un riquadro...
Si puo' fare?

Ringrazio chi mi rispondera' e chiedo scusa se ho postato nella sezione sbagliata


FunCool: Sposto nella sezione Basi per siti Web.

devi usare il tag <marquee>

Codice:

---

<marquee>codice html delle notizie</marquee>

---

Tengo a precisare che il tag marquee funziona solo con IE e non è validato
In alternatica potresti cercare su google degli script validati dal w3c e visualizzabili anche dagli altri browser...

Ciao ciao...

Il tag marquee funziona bene anche con Firefox, prova a guardare qui: http://www.modenasitiweb.it/panorami...s-marquee.html

Ciao!

Il tag marquee però non è validato dal W3C, quindi sarebbe meglio usare qualcosa di alternativo (ma purtroppo più complesso):

Codice HTML:

---

<script language="javascript">
                /*******************************************
                Vertical Scroller (Marquee Replacement) v-1.3
                Brian Gosselin - http://scriptasylum.com
                *******************************************/
                //ENTER CONTENT TO SCROLL BELOW.
                var content='TUO TESTO';
                var boxheight=70; // BACKGROUND BOX HEIGHT IN PIXELS.
                var boxwidth=300; // BACKGROUND BOX WIDTH IN PIXELS.
                var boxcolor=""; // BACKGROUND BOX COLOR.
                var speed=50; // SPEED OF SCROLL IN MILLISECONDS (1 SECOND=1000 MILLISECONDS)..
                var pixelstep=1; // PIXELS "STEPS" PER REPITITION.
                var godown=false; // TOP TO BOTTOM=TRUE , BOTTOM TO TOP=FALSE
                var pauseOnmouseover=true; //SET TO "true" TO ENABLE PAUSE WHEN MOUSEOVER, "false" TO DISABLE IT.
                // DO NOT EDIT BEYOND THIS POINT
                var outer,inner,elementheight,ref,refX,refY;
                var w3c=(document.getElementById)?true:false;
                var ns4=(document.layers)?true:false;
                var ie4=(document.all && !w3c)?true:false;
                var ie5=(document.all && w3c)?true:false;
                var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
                var txt='';
                var goscroll=true;
                if(ns4){
                txt+='<table cellpadding=0 cellspacing=0 height='+boxheight+' width='+boxwidth+'><tr><td>';
                txt+='<ilayer name="ref" bgcolor="'+boxcolor+'" width='+boxwidth+' height='+boxheight+'></ilayer>';
                txt+='</td></tr></table>'
                txt+='<layer name="outer" bgcolor="'+boxcolor+'" visibility="hidden" width='+boxwidth+' height='+boxheight+' '+((pauseOnmouseover)? 'onmouseover="goscroll=false" onmouseout="goscroll=true"':'')+'>';
                txt+='<layer name="inner" width='+(boxwidth-4)+' height='+(boxheight-4)+' visibility="hidden" left="2" top="2" >'+content+'</layer>';
                txt+='</layer>';
                }else{
                txt+='<div id="ref" style="position:relative; width:'+boxwidth+'; height:'+boxheight+'; background-color:'+boxcolor+';"></div>';
                txt+='<div id="outer" style="position:absolute; width:'+boxwidth+'; height:'+boxheight+'; visibility:hidden; background-color:'+boxcolor+'; overflow:hidden" '+((pauseOnmouseover)? 'onmouseover="goscroll=false" onmouseout="goscroll=true"':'')+'>';
                txt+='<div id="inner" style="position:absolute; visibility:hidden; left:2px; top:2px; width:'+(boxwidth-4)+'; overflow:hidden; cursor:default;" '+((pauseOnmouseover)? 'onmouseover="goscroll=false" onmouseout="goscroll=true"':'')+'>'+content+'</div>';
                txt+='</div>';
                }
                document.write(txt);
                txt='';
                function getElHeight(el){
                if(ns4)return (el.document.height)? el.document.height : el.clip.bottom-el.clip.top;
                else if(ie4||ie5)return (el.style.height)? el.style.height : el.clientHeight;
                else return (el.style.height)? parseInt(el.style.height):parseInt(el.offsetHeight);
                }
                function getPageLeft(el){
                var x;
                if(ns4)return el.pageX;
                if(ie4||w3c){
                x = 0;
                while(el.offsetParent!=null){
                x+=el.offsetLeft;
                el=el.offsetParent;
                }
                x+=el.offsetLeft;
                return x;
                }}
                function getPageTop(el){
                var y;
                if(ns4)return el.pageY;
                if(ie4||w3c){
                y=0;
                while(el.offsetParent!=null){
                y+=el.offsetTop;
                el=el.offsetParent;
                }
                y+=el.offsetTop;
                return y;
                }}
                function scrollbox(){
                if(goscroll){
                if(ns4){
                inner.top+=(godown)? pixelstep: -pixelstep;
                if(godown){
                if(inner.top>boxheight)inner.top=-elementheight;
                }else{
                if(inner.top<2-elementheight)inner.top=boxheight+2;
                }}else{
                inner.style.top=parseInt(inner.style.top)+((godown)? pixelstep: -pixelstep)+'px';
                if(godown){
                if(parseInt(inner.style.top)>boxheight)inner.style.top=-elementheight+'px';
                }else{
                if(parseInt(inner.style.top)<2-elementheight)inner.style.top=boxheight+2+'px';
                }}}}
                window.onresize=function(){
                if(ns4)setTimeout('history.go(0)', 400);
                else{
                outer.style.left=getPageLeft(ref)+'px';
                outer.style.top=getPageTop(ref)+'px';
                }}
                window.onload=function(){
                outer=(ns4)?document.layers['outer']:(ie4)?document.all['outer']:document.getElementById('outer');
                inner=(ns4)?outer.document.layers['inner']:(ie4)?document.all['inner']:document.getElementById('inner');
                ref=(ns4)?document.layers['ref']:(ie4)?document.all['ref']:document.getElementById('ref');
                elementheight=getElHeight(inner);
                if(ns4){
                outer.moveTo(getPageLeft(ref),getPageTop(ref));
                outer.clip.width=boxwidth;
                outer.clip.height=boxheight;
                inner.top=(godown)? -elementheight : boxheight-2;
                inner.clip.width=boxwidth-4;
                inner.clip.height=elementheight;
                outer.visibility="show";
                inner.visibility="show";
                }else{
                outer.style.left=getPageLeft(ref)+'px';
                outer.style.top=getPageTop(ref)+'px';
                inner.style.top=((godown)? -elementheight : boxheight)+'px';
                inner.style.clip='rect(0px, '+(boxwidth-4)+'px, '+(elementheight)+'px, 0px)';
                outer.style.visibility="visible";
                inner.style.visibility="visible";
                }
                setInterval('scrollbox()',speed);
                }
          </script>

---

@tuttoeniente: ma dove dovrei inserire il testo della news nel codice da te inserito?
E ne potrei mettere piu' d'una di notizia?

Codice:

---

<script language="javascript">
                /*******************************************
                Vertical Scroller (Marquee Replacement) v-1.3
                Brian Gosselin - http://scriptasylum.com
                *******************************************/
                //ENTER CONTENT TO SCROLL BELOW.
                var content='TUO TESTO';
                var boxheight=70; // BACKGROUND BOX HEIGHT IN PIXELS.
                var boxwidth=300; // BACKGROUND BOX WIDTH IN PIXELS.
                var boxcolor=""; // BACKGROUND BOX COLOR.
                var speed=50; // SPEED OF SCROLL IN MILLISECONDS (1 SECOND=1000 MILLISECONDS)..
                var pixelstep=1; // PIXELS "STEPS" PER REPITITION.
                var godown=false; // TOP TO BOTTOM=TRUE , BOTTOM TO TOP=FALSE
                var pauseOnmouseover=true; //SET TO "true" TO ENABLE PAUSE WHEN MOUSEOVER, "false" TO DISABLE IT.
                // DO NOT EDIT BEYOND THIS POINT
                var outer,inner,elementheight,ref,refX,refY;
                var w3c=(document.getElementById)?true:false;
                var ns4=(document.layers)?true:false;
                var ie4=(document.all && !w3c)?true:false;
                var ie5=(document.all && w3c)?true:false;
                var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
                var txt='';
                var goscroll=true;
                if(ns4){
                txt+='<table cellpadding=0 cellspacing=0 height='+boxheight+' width='+boxwidth+'><tr><td>';
                txt+='<ilayer name="ref" bgcolor="'+boxcolor+'" width='+boxwidth+' height='+boxheight+'></ilayer>';
                txt+='</td></tr></table>'
                txt+='<layer name="outer" bgcolor="'+boxcolor+'" visibility="hidden" width='+boxwidth+' height='+boxheight+' '+((pauseOnmouseover)? 'onmouseover="goscroll=false" onmouseout="goscroll=true"':'')+'>';
                txt+='<layer name="inner" width='+(boxwidth-4)+' height='+(boxheight-4)+' visibility="hidden" left="2" top="2" >'+content+'</layer>';
                txt+='</layer>';
                }else{
                txt+='<div id="ref" style="position:relative; width:'+boxwidth+'; height:'+boxheight+'; background-color:'+boxcolor+';"></div>';
                txt+='<div id="outer" style="position:absolute; width:'+boxwidth+'; height:'+boxheight+'; visibility:hidden; background-color:'+boxcolor+'; overflow:hidden" '+((pauseOnmouseover)? 'onmouseover="goscroll=false" onmouseout="goscroll=true"':'')+'>';
                txt+='<div id="inner" style="position:absolute; visibility:hidden; left:2px; top:2px; width:'+(boxwidth-4)+'; overflow:hidden; cursor:default;" '+((pauseOnmouseover)? 'onmouseover="goscroll=false" onmouseout="goscroll=true"':'')+'>'+content+'</div>';
                txt+='</div>';
                }
                document.write(txt);
                txt='';
                function getElHeight(el){
                if(ns4)return (el.document.height)? el.document.height : el.clip.bottom-el.clip.top;
                else if(ie4||ie5)return (el.style.height)? el.style.height : el.clientHeight;
                else return (el.style.height)? parseInt(el.style.height):parseInt(el.offsetHeight);
                }
                function getPageLeft(el){
                var x;
                if(ns4)return el.pageX;
                if(ie4||w3c){
                x = 0;
                while(el.offsetParent!=null){
                x+=el.offsetLeft;
                el=el.offsetParent;
                }
                x+=el.offsetLeft;
                return x;
                }}
                function getPageTop(el){
                var y;
                if(ns4)return el.pageY;
                if(ie4||w3c){
                y=0;
                while(el.offsetParent!=null){
                y+=el.offsetTop;
                el=el.offsetParent;
                }
                y+=el.offsetTop;
                return y;
                }}
                function scrollbox(){
                if(goscroll){
                if(ns4){
                inner.top+=(godown)? pixelstep: -pixelstep;
                if(godown){
                if(inner.top>boxheight)inner.top=-elementheight;
                }else{
                if(inner.top<2-elementheight)inner.top=boxheight+2;
                }}else{
                inner.style.top=parseInt(inner.style.top)+((godown)? pixelstep: -pixelstep)+'px';
                if(godown){
                if(parseInt(inner.style.top)>boxheight)inner.style.top=-elementheight+'px';
                }else{
                if(parseInt(inner.style.top)<2-elementheight)inner.style.top=boxheight+2+'px';
                }}}}
                window.onresize=function(){
                if(ns4)setTimeout('history.go(0)', 400);
                else{
                outer.style.left=getPageLeft(ref)+'px';
                outer.style.top=getPageTop(ref)+'px';
                }}
                window.onload=function(){
                outer=(ns4)?document.layers['outer']:(ie4)?document.all['outer']:document.getElementById('outer');
                inner=(ns4)?outer.document.layers['inner']:(ie4)?document.all['inner']:document.getElementById('inner');
                ref=(ns4)?document.layers['ref']:(ie4)?document.all['ref']:document.getElementById('ref');
                elementheight=getElHeight(inner);
                if(ns4){
                outer.moveTo(getPageLeft(ref),getPageTop(ref));
                outer.clip.width=boxwidth;
                outer.clip.height=boxheight;
                inner.top=(godown)? -elementheight : boxheight-2;
                inner.clip.width=boxwidth-4;
                inner.clip.height=elementheight;
                outer.visibility="show";
                inner.visibility="show";
                }else{
                outer.style.left=getPageLeft(ref)+'px';
                outer.style.top=getPageTop(ref)+'px';
                inner.style.top=((godown)? -elementheight : boxheight)+'px';
                inner.style.clip='rect(0px, '+(boxwidth-4)+'px, '+(elementheight)+'px, 0px)';
                outer.style.visibility="visible";
                inner.style.visibility="visible";
                }
                setInterval('scrollbox()',speed);
                }
          </script>

---

Puoi inserire tutte le notizie che vuoi dove ho evidenziato in rosso.
Fai solo attenzione a sostituire tutti gli apici (') con \' perché altrimenti non funziona.

Posso sembrarti un po' scemo...ma se le notizie sono piu' d'una...basta che vado a capo, o devo fare altre operazioni???

Tratti tutto come se fosse normale HTML, quindi per andare a capo devi inserire un <br>. Se ti trovi meglio puoi anche andare a capo scrivendo il codice, non crea problemi.

sebbene io non sia pratico di html penso che dovro' fare cosi'

Notizia 1

<br> Notizia 2

<br> ecc...

E' cosi'???

SI, basta che come ha già detto, prima delgi apici ti ricordi di inserire lo slash.

Ok appena ho tempo ci provo e vi faccio sapere!