Afficher les nouvelles avec javascript

Je ne cesse de faire face à ce problème. Affichage des actualités sur un site Web Et je voudrais trouver une solution à utiliser comme un modèle, quelque chose que je peux simplement laisser tomber sur un site facilement.Afficher les nouvelles avec javascript

La solution que je vois est une iframe avec javascript pour faire défiler le contenu. Cependant, je suis vraiment opposé à l'idée d'utiliser des iframes, je pense que le temps pour ceux-ci est passé.

Je veux utiliser JS sans cadre, car il interdit l'utilisation d'autres frameworks. Est-ce que quelqu'un sait où je pourrais trouver quelque chose de robuste?

(Je pense à l'aide de défilement vertical, mais je suis aussi curieux au sujet d'autres solutions)

Source

2009-11-11 Daniel

"Je veux utiliser JS sans framework, car il interdit l'utilisation d'autres frameworks." Comment? –

"afficher des nouvelles" est une demande complètement vague. Vous devez décrire la présentation visuelle et l'interaction que vous souhaitez réaliser. En outre, comme le suggère Ben, l'utilisation d'un framework JS ne vous empêche pas d'en utiliser un autre (bien que vous souhaitiez en conserver un si vous le pouvez dans une perspective de taille de fichier pure) –

- Si vous utilisez un framework jquery scroller, vous ne pouvez pas utiliser (d'après mon expérience) mootools pour faire face à une autre tâche sur la même page. – Daniel

J'ai trouvé un script qui semble wok bien pour moi, peut-être quelqu'un d'autre-il été utile

/*********************************************** 
* Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com) 
* This notice MUST stay intact for legal use 
* Visit http://www.dynamicdrive.com/ for this script and 100s more. 
***********************************************/ 

var delayb4scroll=1000; //Specify initial delay before marquee starts to scroll on page (2000=2 seconds) 
var marqueespeed=1; //Specify marquee scroll speed (larger is faster 1-10) 
var pauseit=1; //Pause marquee onMousever (0=no. 1=yes)? 
var tim; 
////NO NEED TO EDIT BELOW THIS LINE//////////// 

var copyspeed=marqueespeed; 
var pausespeed=(pauseit==0)? copyspeed: 0; 
var actualheight=''; 

function scrollmarquee(){ 
    //document.write(parseInt(cross_marquee.style.top)); 
     //if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) { 
    if (document.getElementById('track').value == "") { 
     if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) { 
      cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"; 
      //alert(actualheight); 
     } 
     else { 
      //alert(parseInt(marqueeheight)); 
      cross_marquee.style.top=parseInt(marqueeheight)-8+"px"; 
     } 
    } 
} 

//on mouse out 
function mouse_out() { 
    clearTimeout(tim); 
    scrollmarquee; 
} 

//init() 
function initializemarquee(){ 
    cross_marquee=document.getElementById("vmarquee"); 
    cross_marquee.style.top=0; 
    marqueeheight=document.getElementById("marqueecontainer").offsetHeight; 
    actualheight=cross_marquee.offsetHeight; 
    if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit 
     cross_marquee.style.height=marqueeheight+"px"; 
     cross_marquee.style.overflow="scroll"; 
     return 
    } 
    setTimeout('lefttime=setInterval("scrollmarquee()",55)', delayb4scroll); 
} 

//event listener 
if (window.addEventListener) { 
    window.addEventListener("load", initializemarquee, false); 
} 
else if (window.attachEvent) { 
    window.attachEvent("onload", initializemarquee); 
} 
else if (document.getElementById) { 
    window.onload=initializemarquee; 
}

le code html:

<!-- scroll --> 
<div id="marqueecontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"> 
<div id="vmarquee" class="vmarquee_content"> 
    <!--YOUR SCROLL CONTENT HERE--> 
</div> 
</div> 
<input id="track" name="track" type="hidden" value="">

et le css:

#marqueecontainer{ 
    position: relative; 
    width: 250px; /*marquee width */ 

    height: 150px; /*marquee height */ 
    background-color: white; 
    overflow: hidden; 
    border: 1px solid #666666; 
    padding: 2px; 
    padding-left: 4px; 
} 
.scroll_div { 
    border:solid 1px #3366FF; 
    width: 260px; 
    width/**/: 280px !important; 
} 
.vmarquee_content { 
    position:absolute; 
    font-size:12px; 
    font-family:Arial, Helvetica, sans-serif; 
}

Source

2009-11-12 18:44:50 Daniel

ne peut pas initialiser deux ou plusieurs Scroller en même temps –

Pourquoi vous ne prenez pas un div insérer une autre div une donne la deuxième div un top nagative valeur.

<script type="text/javascript"> 
function toTop(top_value) 
{ 
    if (top_value == 0) 
    { document.getElementById('news').css.top = '0'; } 

    document.getElementById('news').css.top = '-5px'; 
} 
window.setTimeout('toTop(1)', 100); 
window.setTimeout('toTop(0)', 10000); 
</script>

Ceci n'a pas été testé, mais je l'ai fait de cette façon.

Source

2009-11-11 21:54:40 MaikL80

Afficher les nouvelles avec javascript

Répondre

Questions connexes