HTML - Colocar noticias en un cintillo tipo marquesina

 
Vista:
sin imagen de perfil

Colocar noticias en un cintillo tipo marquesina

Publicado por Bladimir (4 intervenciones) el 05/06/2016 05:39:33
Hola a todos. Tengo una pagina web y quiero colocar noticias de un rss que aparezcan en una marquesina. El codigo que estoy usando es el siguiente:
1
2
3
4
5
<div id="header">
        <marquee behavior="Scroll" class="none">
   	     <a style='color:red; font-size:1em; font-weight:bold; font-family: Arial; font-size: 24px;' href="http://feeds.feedburner.com/aporrea">href</a>
   	    </marquee>
</div>
Pero no hallo la forma de que aparezcan las noticias. Alguna ayuda sera apreciada. Saludos.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil

Colocar noticias en un cintillo tipo marquesina

Publicado por Bladimir (4 intervenciones) el 05/06/2016 18:34:05
Gracias xve por la informacion, pero como se haria con css3 o javascript?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Colocar noticias en un cintillo tipo marquesina

Publicado por Carolina Vazquez (7 intervenciones) el 06/06/2016 03:13:39
Hola tengo un código para el efecto marquilla con css3, espero te sirva. Te dejo también el link de un vídeo tutorial.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
.animacion {
display:block;
width:auto;
height:40px;
position:absolute;
font-family:georgia, serif;
font-size:16px;
line-height:40px;
float:left;
width:auto;
color:#000;
font-weight:bold;
padding:0 10px;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-webkit-animation-duration:17s;
-webkit-animation-name: scroll;
}
 
.animacion a {color:#c00;}
 
@-webkit-keyframes scroll {
0% {left:90%;}
100% {left:-100%;}
}
 
.animacion:hover { -webkit-animation-play-state: paused;}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Colocar noticias en un cintillo tipo marquesina

Publicado por Bladimir (4 intervenciones) el 07/06/2016 21:52:52
Hola Carolina. Vi el video. Pero lo que no hallo es como hacer para que las noticias se vean en la animacion. Ese es el engranaje que no encuentro. Gracias por tu ayuda. Saludos cordiales.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Colocar noticias en un cintillo tipo marquesina

Publicado por Bladimir (4 intervenciones) el 11/06/2016 22:48:18
Despues de varios dias de busqueda pude resolver el asunto. Lo hice con php. Aqui dejo el codigo para difundir el conocimiento:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?php
 
$RSS = new LectorRSS ("http://feeds.feedburner.com/aporrea");
class LectorRSS {
var $url;
var $data;
function LectorRSS ($url){
$this->url;
$this->data = implode ("", file ($url));
}
function obtener_items (){
preg_match_all ("/<item .*>.*<\/item>/xsmUi", $this->data, $matches);
$items = array ();
foreach ($matches[0] as $match){
$items[] = new RssItem ($match);
}
return $items;
}
}
class RssItem {
var $title, $url;
function RssItem ($xml){
$this->populate ($xml);
}
function populate ($xml){
preg_match ("/<title> (.*) <\/title>/xsmUi", $xml, $matches);
$this->title = $matches[1];
preg_match ("/<link> (.*) <\/link>/xsmUi", $xml, $matches);
$this->url = $matches[1];
}
function obtener_titulo (){
return $this->title;
}
function obtener_url (){
return $this->url;
}
}
echo "<div>";
 echo "<marquee behavior='Scroll' class='none'  behavior='alternate'>";
foreach ($RSS->obtener_items () as $item){
printf ('<a target="_BLANK" href="%s">%s.   </a>', $item->obtener_url (), $item->obtener_titulo ());
}
 echo "</marquee>";
echo "</div>";
?>
Gracias a todos. Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar