08/03/2012, 12:36
|
| | Fecha de Ingreso: marzo-2012
Mensajes: 2
Antigüedad: 12 años, 9 meses Puntos: 0 | |
Respuesta: Slider JS y JQUERY Perdón, ahí lo pongo.
<tr>
<td height="642" valign="top" bgcolor="#FFFFFF"><table width="574" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="574" height="18" bgcolor="#FFFFFF"><div align="left"><img src="imagenes/novedad.jpg" width="96" height="24"></div></td>
</tr>
<tr>
<td height="275" bgcolor="#F4F4F4"> Este es el código del Slider
<div align="center" class="slider">
<!--/top-->
<div id="header">
<div class="wrap">
<div id="slide-holder">
<div id="slide-runner">
<a href=""><img id="slide-img-2" src="images/noticia2.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-3" src="images/noticia3.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-4" src="images/noticia4.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-5" src="images/noticia5.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-6" src="images/noticia6.png" class="slide" alt="" /></a>
<div id="slide-controls">
<p id="slide-client" class="text"><strong>Fecha </strong><span></span></p>
<p id="slide-desc" class="text"></p>
<p id="slide-nav"></p>
</div>
</div>
<!--content featured gallery here -->
</div>
<script type="text/javascript">
if(!window.slider) var slider={};slider.data=
[{"id":"slide-img-6","client":"01-03-2012","desc":"Sección: Publicaciones-Boletín"},
{"id":"slide-img-5","client":"29-02-2012","desc":"Sección: Silvopastoril"},
{"id":"slide-img-4","client":"29-02-2012","desc":"Sección: Eventos"},
{"id":"slide-img-3","client":"24-02-2012","desc":"Sección: Incendios"},
{"id":"slide-img-2","client":"10-02-2012","desc":"Sección: Incendios"},
];
</script>
</div></div><!--/header-->
</div>
</div>
</td>
</tr>
</table>
----------------------------------------------------------------------------------- este es el CSS
html{
height:100%;
}
body{
height:100%;
color:#a4a4a4;
cursor:default;
font-size:11px;
line-height:16px;
text-align:center;
background-color:#000;
background-position:50% 0;
background-repeat:no-repeat;
font-family:Tahoma,sans-serif;
}
a:link,a:visited{
color:#fff;
text-decoration:none;
}
a img{
border:0;
}
div.wrap{
width:574px;
margin:0 auto;
text-align:left;
}
div#top div#nav{
float:left;
clear:both;
width:574px;
height:52px;
margin:22px 0 0;
background:url url(images/nav-bg.png) 0 0 no-repeat;
}
div#top div#nav ul{
float:left;
width:574px;
height:52px;
list-style-type:none;
}
div#nav ul li{
float:left;
height:52px;
}
div#nav ul li a{
border:0;
height:52px;
display:block;
line-height:52px;
text-indent:-9999px;
}
div#header{
margin:-1px 0 0;
}
div#video-header{
height:574px;
margin:-1px 0 0;
}
div#header div.wrap{
height:0px;
background:url(images/header-bg.png) 50% 0 no-repeat;
}
div#header div#slide-holder{
width:592px;
height:299px;
top: 309px;
left: 379px;
}
div#header div#slide-holder div#slide-runner{
top:-135px;
width:594px;
height:264px;
overflow:hidden;
position:relative;
left: 0px;
}
div#header div#slide-holder img{
margin:0;
display:none;
position:absolute;
}
div#header div#slide-holder div#slide-controls{
left:0;
bottom:5px;
width:574px;
height: 46px;
display:none;
position:absolute;
background:url(images/slide-bg.png) 0 0;
}
div#header div#slide-holder div#slide-controls p.text{
float:left;
color:#fff;
display:inline;
font-size:10px;
line-height:16px;
margin:15px 0 0 20px;
text-transform:uppercase;
}
div#header div#slide-holder div#slide-controls p#slide-nav{
float:right;
height:24px;
display:inline;
margin:11px 15px 0 0;
}
div#header div#slide-holder div#slide-controls p#slide-nav a{
float:left;
width:24px;
height:24px;
display:inline;
font-size:11px;
margin:0 5px 0 0;
line-height:24px;
font-weight:bold;
text-align:center;
text-decoration:none;
background-position:0 0;
background-repeat:no-repeat;
}
div#header div#slide-holder div#slide-controls p#slide-nav a.on{
background-position:0 -24px;
}
div#header div#slide-holder div#slide-controls p#slide-nav a{background-image:url(images/silde-nav.png);}
div#nav ul li a{background:url(images/nav.png) no-repeat;}
.slider {
margin-top: 0px;
margin-right: auto;
width: 574px;
} |