Ir para o conteúdo
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

DevilRocks92

Banner Slideshow

Mensagens Recomendadas

DevilRocks92

Boas, P@P

Eu quero fazer um slideshow como banner, mas tenho o codigo do slideshow: (que em prinicpio esta correcto)

<?PHP
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';

$conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ('Error connecting to mysql');

$dbname = 'destaques';
mysql_select_db($dbname);
?>

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#slide_fotos').cycle({
	fx: 'fade',
	pager: '#pager'
});
});
</script>
<style type="text/css">
* {
list-style: none;
margin: 0;
padding: 0;
}
body {
font: 12px Verdana, sans-serif;
color: #000;
}
a { text-decoration: none; }
a:hover { text-decoration: underline; }
#slideshow {
width: 640px;
height: 270px;
position: relative;
}
#slide_fotos p {
position: absolute;
right: 0;
top: 210px;
z-index: 3;
padding: 10px 20px;
background: url('images/over_white.png');
}
#slide_fotos {
height: 100%;
overflow: hidden;
}
#pager {
position: absolute;
z-index: 10;
top: 20px;
right: 20px;
}
#pager a {
color: #000;
width: 17px;
height: 17px;
line-height: 15px;
text-align: center;
display: inline-block;
font-size: 10px;
margin: 2px;
color: #fff;
}
#pager a.activeSlide {
color: #000;
background: url('images/over_white.png');
}
</style>
</head>
<body>
<div id="slideshow">
	<ul id="slide_fotos">
		<?PHP



		?>
	</ul><!-- /fotos -->
	<p id="pager">

	</p><!-- /pager -->

</div><!-- /slideshow -->

<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-7671312-4']);
  _gaq.push(['_trackPageview']);
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
</body>
</html>

E gostaria de inserir na parte que pretence ao banner no codigo do css:

body {
background:#FBFAF5 repeat-x top left;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: justify;
color: #666666;
margin:0 auto;
}

h1 {
}

h2, h3 {
margin-top: 0px;
}

h4, h5, h6 {
}

p, ol, ul, dl, blockquote {
}

a {
color: #000000;
text-decoration: none;
}

a:hover {
text-decoration: none;
color: #235510;
}


/* Header */

#header {
width: 950px;
height:100px;
margin: 0px auto;
}

#header h1 {
text-align: left;
margin: 0px;
padding-top: 40px;
font-size: 32px;
color: #000000;
padding-left: 10px;
}

#header h2 {
margin: 0px;
text-align: center;
font-size: 11px;
}

#header a {
text-decoration: none;
color:#000000;
}

/*banner*/
#banner {
width: 950px;
height: 346px;
margin: 0px auto;
background:url(images/bann_menu.png) no-repeat left top;
}


/* Post */

.latest-post {
padding: 0 0 1em 0;
}

.latest-post h2 {
margin-bottom: 0.5em;
padding: 8px 10px 2px 10px;
text-transform: uppercase;
font-size: 16px;
color: #75C210;
border-bottom: 1px solid #cccccc;
}

.post {
padding: 2em 0 1em 0;
}

.post h3 {
margin-bottom: 0.5em;
font-size: 1.2em;
color: #000000;
}

.file * {
color: #5B5B5B;
}

/** Forms */

form {
margin: 0px;
padding: 0px;
}

.input1 {
width: 110px;
background-color: #2A2A2A;
border: 1px solid #363636;
color: #FFFFFF;
}

/* Content */

#content {
width: 950px;
margin: 0 auto 10px auto;
padding: 0px 0px 0px 0px;
}

#colTwo {
margin: 0px;
padding: 0px 15px 15px 15px;
background-color: #FFFFFF;
}

#colTwo p {
line-height: 25px;
}
#colTwo img{
padding-right:10px;
padding-top:10px;
}

#colTwo h3{
padding: 10px 10px 2px 10px;
text-transform: uppercase;
color: #000000;
}

/* Footer */

#footer {
width: 100%;
margin: 0px auto;
padding: 15px 0px;
height: 200px;
}
#footer a{
text-decoration:none;
color: #38831E;
}
#footer p {
margin: 0px;
text-align: center;
color: #38831E;
}
.devider{height:20px;}
.services{
padding:10px;
border:#E2F9BD 1px solid;
background-color:#FFFFFF;
margin-top:30px;
}
.button{
display:block;
width:80px;
height:25px;
background:#38831E;
color:#FFFFFF;
float:right;
margin-bottom:5px;
padding-left:15px;
}

Alguem me pode explicar, por favor?

Obrigado

DevilRocks92

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!

Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.

Entrar Agora

×

Aviso Sobre Cookies

Ao usar este site você aceita os nossos Termos de Uso e Política de Privacidade. Este site usa cookies para disponibilizar funcionalidades personalizadas. Para mais informações visite esta página.