Slide de fotos - site
Não consigo visualizar fotos, sem ser em miniaturas, alguém me ajuda?
<html>
<head>
<style>
ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:12em;
text-decoration:none;
color:black;
background-color:white;
padding:0.2em 0.6em;
border-right:1px solid black;
}
a:hover {background-color:blue;}
li {display:inline;}
</style>
</head>
<body background="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/fundo.jpg">
<table align="100%">
<tr>
<td>
<img src="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Imagem2.jpg">
</td>
</tr>
</table>
<title> Meio Technology </title>
<hr> </hr>
<div id="menu" align="center">
<h3> <li><a href="">Principal </a></li> </h3>
<h3><li><a href="">Tecnologia Sustentável</a></li> </h3>
<h3><li><a href="">Projetos Futuros </a></li> </h3>
<h3><li><a href="">Ambientes e a tecnologia </a></li> </h3>
<h3><li><a href="">Parceiros</a></li> </h3>
<br>
<br>
<br>
<br>
<br>
<br>
<style type="text/css">
.transp {
position: absolute;
top: 280px;
left: 10px;
width: 515px;
height: 50px;
background: #000000;
padding: 5px;
-moz-opacity:0.5;
opacity: .5;
filter:alpha(opacity=50);
-khtml-opacity: 0.5;
}
#tarja {
position: absolute;
top: 290px;
left: 10px;
width: 515px;
height: 50px;
padding: 5px;
z-index: 1;
font-family: Trebuchet MS;
font-size: 0.8em;
font-weight: bold;
color: #ffffff;
}
img {
border:#000000;
margin-top:2px;
margin-bottom:2px;
}
a {
outline:0;
}
</style>
<script>
// Photos
var myPix = new Array(4)
myPix[0] = "u2";
myPix[1] = "skank";
myPix[2] = "Fernando";
myPix[3] = "Fernando";
// Text
var myText = new Array(4);
myText[0] = "Placa de circuito";
myText[1] = "Carregador";
myText[2] = "Estudante";
myText[3] = "Conscientização";
// Configuração
var format = ".jpg";
var timer = "4000";
var i = 1;
function animator(obj,pega) {
if (obj != "fecha") {
intervalo = window.setInterval("change()",timer);
}
else {
window.clearInterval(intervalo);
if (pega == "Placa de Circuito") {document.getElementById("Placa de Circuito.jpg").src = 'C:\Users\Marcatti\Desktop\Trabalho
html\Macattt\Imagens\NoticiasFotos/Placa de Circuito.jpg' + myPix[0] + format;
document.getElementById('tarja').
innerHTML=myText[0];
}else if (pega == "carregador") {
document.getElementById("image").src = 'C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens
\NoticiasFotos/carregador.jpg' + myPix[1] + format;
document.getElementById
('tarja').innerHTML=myText[1];
}
else if (pega == "Estudante") {document.getElementById("Estudante").src = 'C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Estudante.jpg' +
myPix[2] + format;
document.getElementById
('tarja').innerHTML=myText[2];
}
else {
document.getElementById("Conscientização").src = 'C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Conscientização' + myPix[3] + format;
document.getElementById('tarja').innerHTML= myText[3];
}
intervalo = window.setInterval("change()",timer);
}
}
function change() {
if (i < myPix.length)
{
document.getElementById("image").src = 'imagens/' + myPix[i % myPix.length] + format;
if (i == 0) {
document.getElementById('tarja').innerHTML=myText[i];}else if (i ==
1)
{
document.getElementById('tarja').innerHTML=myText[i];
}else if (i == 2) {
document.getElementById('tarja').innerHTML=myText[i];}else {
document.getElementById
('tarja').innerHTML=myText[i];
i = -1;
}
i++;
}else { i = 0; }
}
window.onload=animator('go');
</script>
<table cellpadding="0" cellspacing="0" align="left">
<tr>
<td bgcolor="#000000" nowrap="nowrap">
<img id="image" src="C:\Users\Marcatti\Downloads\Olha ae(1)Imagem2.jpg" width='550' height='290' style="margin:0 10px 0px 0px;"></td>
<!--
1) Em id use os valores que
colocou na Array
2) Em src coloque o endereço das imagens
-->
<td bgcolor="#000000"style="width:68px;" nowrap="nowrap">
<a href="javascript:;">
<img class="imgmenuone" src="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Conscientização.jpg" id="Carregador" onClick="animator('fecha',id);"
width='58' height='58'></a>
<br>
<a href="javascript:;">
<img class="imgmenu" id="Estudante" src="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Estudante.jpg" onClick="animator('fecha',id);"
width='58' height='58'></a>
<br>
<a href="javascript:;">
<img class="imgmenu" id="redhot" src="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Placa de circuito.jpg" onClick="animator('fecha',id);"
width='58' height='58'></a>
<br>
<a href="javascript:;">
<img class="imgmenu" id="barao" src="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/Carregador.jpg" onClick="animator('fecha',id);" width='58'
height='58'></a>
</td>
</tr>
</table>
<div class="transp"></div>
<div id="tarja">Meio Tecnológico</div>
<table border="0" background="C:\Users\Marcatti\Desktop\Trabalho html\Macattt\Imagens\NoticiasFotos/PC3.jpg" align="right" width="300" >
<tr>
<td>
<table border="1" cellspacing="0" width="300px"bgcolor="green">
<tr><td align="center"<i><b>Atividades</b></i></td></tr>
<table border="0">
</tr>
<br>
<br>
<tr>
<td>
<table border="1" cellspacing="0" width="195px" align="center">
<tr><td align="center"<i><b><a href="">Notícias</a></b></i></td></tr>
<table border="0">
</tr>
<br>
<br>
<tr>
<td>
<table border="1" cellspacing="0" width="195px" align="center">
<tr><td align="center"<i><b><a href="">Energia Renovável</a></b></i></td></tr>
<table border="0">
</tr>
<br>
<br>
<tr>
<td>
<table border="1" cellspacing="0" width="195px" align="center">
<tr><td align="center"<i><b><a href="">Inovações</a></b></i></td></tr>
<table border="0">
</tr>
<br>
<br>
<tr>
<td>
<table border="1" cellspacing="0" width="195px" align="center">
<tr><td align="center"<i><b><a href="">Reciclagem</a></b></i></td></tr>
<table border="0">
</tr>
<br>
<br>
<tr>
<td>
<table border="1" cellspacing="0" width="195px" align="center">
<tr><td align="center"<i><b><a href="">Feiras</a></b></i></td></tr>
<table border="0">
</tr>
<br>
<br>
<tr>
<td>
<table border="1" cellspacing="0" width="195px" align="center">
<tr><td align="center"<i><b><a href="">Calendário</a></b></i></td></tr>
<table border="0">
</td></tr></table>
<table border="0" cellspacing="0" width="195px" align="right">
<tr>
<td>
</td>
</tr>
</body>
</html>Discussão (1)
Carregando comentários...