• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

Kalfis

Galeria de Imagens

2 mensagens neste tópico

Boas, eu estou a construir uma galeria de imagens através de Javascript, mas estou a ter uns problemas, ele vai-me buscar as imagens, mas nao consigo ir buscá-las dentro de uma pasta (ele só me vai buscar as imagens se elas estiverem fora de qualquer pasta) e outro problema é q tive de fazer uma variável para ir buscar as imagens, e tive de por um limite de imagens a ter, no meu caso 256, mas ela vai-me sempre buscar as imagens, mesmo nao tendo as 256 o produtor vai ate aos 256, e queria mostrar apenas as imagens q tenho.

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>PushButton SlideShow</title>

<!-- 
Set up the caption font in the following style.
Also set the styles for the controls.
Place the style script in the head of the page.
//-->

<style type="text/css">
.Caption {
font-family: Arial;
font-weight: normal;
font-size:  12pt;
color:      #FF3300; }

A.Controls:link    { color:#666666;
                     text-decoration:none;
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
A.Controls:visited { color:#666666; text-decoration:none; 
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
A.Controls:active  { color:#666666; text-decoration:none;
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }
A.Controls:hover   { color:#00FF00; text-decoration:none;
                     font-family: Arial;
                     font-size:   14pt;
                     font-weight: bold; }

</style>

<!-- 
Place the following script in the head of the page.
Follow the set-up instructions within the script.
//-->

<script language="javascript" type="text/javascript">

// (C) 2003 by CodeLifter.com
// Free for all users, but leave in this header.

// ==============================
// Set the following variables...
// ==============================

// Set the slideshow speed (in milliseconds)
var SlideShowSpeed = 3000;

// Set the duration of crossfade (in seconds)
var CrossFadeDuration = 2;

var Picture = new Array(); // don't change this
var Caption = new Array(); // don't change this
var showHot = false;       // don't change this

// Specify the image files...
// To add more images, just continue
// the pattern, adding to the array below.
// To use fewer images, remove lines
// starting at the end of the Picture array.
// Caution: The number of Pictures *must*
// equal the number of Captions!

try
{


for(var x = 0; x < 256 ; x= x+1)
{
    Picture[x]  = x+'.JPG';
    Caption[x]  = x+'.JPG';
}
}
catch(err)
{}



// Specify the Captions...
// To add more captions, just continue
// the pattern, adding to the array below.
// To use fewer captions, remove lines
// starting at the end of the Caption array.
// Caution: The number of Captions *must*
// equal the number of Pictures!




// =====================================
// Do not edit anything below this line!
// =====================================

var tss;
var iss;
var jss = 0;
var pss = Picture.length-1;

var preLoad = new Array();
for (iss = 1; iss < pss+1; iss++){
preLoad[iss] = new Image();
preLoad[iss].src = Picture[iss];}

function control(how){
if (showHot){
if (how=="H") jss = 1;
if (how=="F") jss = jss + 1;
if (how=="B") jss = jss - 1;
if (jss > (pss)) jss=1;
if (jss < 1) jss = pss;
if (document.all){
document.images.PictureBox.style.filter="blendTrans(duration=2)";
document.images.PictureBox.style.filter="blendTrans(duration=CrossFadeDuration)";
document.images.PictureBox.filters.blendTrans.Apply();}
document.images.PictureBox.src = preLoad[jss].src;
if (document.getElementById) document.getElementById("CaptionBox").innerHTML= Caption[jss];
if (document.all) document.images.PictureBox.filters.blendTrans.Play();
}}






</script>

</head>

<!--
Add onload='showHot=true;' to the body tag.  This is
needed to prevent false object calls while the page
is loading. Optional: If you are using this in a
popup, as in this demo, adding self.focus() to the
onload event in the body tag will bring the popup
to the front each time it is loaded [recommended]. 
//-->

<body onload='showHot=true;self.focus();' style="background-color:#000000" link="#FF0000" vlink="#FF0000" alink="#FF0000">

<!--
The following table holds the images, captions, and controls.
Place the table in your page where you want the slideshow
to appear.  Follow the instructions for each table cell.
//-->

<div align="center">
  <center>

<table border="0" cellpadding="10" cellspacing="0">
  <tr>
    <!--
    The next table cell holds the images.
    Set cell and image width and height the same.
    The img src must have name=PictureBox in its
    tag.  Often, the first image in the Picture
    array in the script is used here; but you
    may also use a different, introductory image
    as we have here, since this image is shown
    only on start-up.
    //-->
    <td width="350" height="280" colspan="3">
    <img alt="" src="desktopography.jpg" name="PictureBox" width="350" height="280" id="IMG1" onclick="height:auto ; width:auto" />
    
    </td>
  </tr>
  <tr>
    <!-- 
    The next table cell holds the captions.
    This table cell must have id=CaptionBox and
    class=Caption in its tag. The default caption
    shows whilst loading in all browsers; NS4
    will show only the default caption, throughout.
    //-->
    <td id="CaptionBox" class="Caption" align="center" colspan="3">
    Galeria de Imagens
    </td>
  </tr>
    <!--
    The following three cells contain the controls.
    Each of the control a href's must contain class=
    Controls, to attach the styles (see top of script).
    To dress this up a bit, you can of course substitute
    <img src> images for the text in the links.
    //-->
  <tr>
    <td align="center">
    <a class="Controls" href="#" onclick="javascript:control('B');">< <</a>
    </td>
    <td align="center">
    <a class="Controls" href="#" onclick="javascript:control('H');">| | |</a>
    </td>
    <td align="center">
    <a class="Controls" href="#" onclick="javascript:control('F');"><b>> ></b></a>
    </td>
  </tr>  
</table>

  </center>
</div>

</body>

</html>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Vai sempre até ao 256 porque não é feita nenhuma verificação se a imagem existe ou não. Para este tipo de situações não podes utilizar JavaScript mas tens de optar por PHP.

0

Partilhar esta mensagem


Link 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