Ir para conteúdo
Fórum Script Brasil
  • 0

[RESOLVIDO] Pause em slideshow


Gugui - Ingo

Pergunta

gostaria de tirar uma dúvida, estou aprendendo javascript e fui fazer um slide show para um site que eu tenho

o meu problema é que queria um botão de pause nesse slideshow, ele funciona, mas somente o pause não.

PS: esse slideshow pega todos os arquivos de uma pasta e mostra no slideshow, uso php e javascript

aqui vai o meu codigo completo do slideshow

index.php

<?php
	$dh = new DirectoryIterator("imagens");
	$files = array();
	
	foreach($dh as $file){
		if(preg_match("/[.]jpg$/",$file)){
			$files[] = "$file";
		}
	}
?>

<html>
    <head>
    	<title> SlideShow </title>
		<link rel="stylesheet" type="text/css" href="style.css" />
		
		<script>
			var image_list = [
				<?php $first = true;
				foreach ($files as $image) { ?>
				<?php echo($first ? "" : ","); ?>
				"<?php echo($image); ?>"
				<?php $first = false; } ?>
			];

			var curimage = 0;
			var pause = false;

			function switchimg(ind){
				var image = image_list[ind];
				var obj = document.getElementById("selimg");
				obj.src = "scale.php?image="+image+"&y=400";
				curimage = ind;
			}

			function nextimage(){
				if(!pause){
					curimage++;
					if(curimage >= image_list.length)
						curimage = 0;
					switchimg(curimage);	
				}
			}

			function pausar(){
				if(pause){
					pause = false;
				}
				else{
					pause = true;
				}
			}

			window.setInterval("nextimage()",2000);
		</script>
	</head>
	<body>

        <button type="button" onclick="pausar()" id="button1">Pause</button>

		<div id="thumbnails">
            <table width="100%">
                <tr>
                    <?php $ind = 0; foreach ($files as $image){ ?>
                    <td width="160" nowrap align="center">
                        <a href="javascript:switchimg(<?php echo($ind);?>)">
                        	<img height="100" src="scale.php?image=<?php echo($image); ?> &y=100" border="0" />
                        </a>
                    </td>
					<?php $ind++;} ?>
                </tr>
            </table>   
        </div>

        <div id="pic">
            <img id="selimg" height="400" src="scale.php?image=<?php echo($files[0]); ?> &y=400" />
        </div>

	</body>
</html>

scale.php

<?php

	$image = $_GET["image"];
	
	$maxy = $_GET["y"];
	$im = @imagecreatefromjpeg ("imagens/".$image);
	$curx = imagesx ($im);
	$cury = imagesy ($im);
	$ratio = $maxy / $cury;
	$newx = $curx * $ratio;
	$newy = $cury * $ratio;
	
	$oim = imagecreatetruecolor($newx, $newy);
	
	imageantialias($oim,true);
	imagecopyresized($oim, $im, 0, 0, 0 ,0, $newx, $newy, $curx, $cury);
	
	header("content-type: image/jpeg");
	imagejpeg($oim);

?>

style.css

body {
	background: white;
}

#thumbnails {
	height:140px;
	width:100%;
	overflow: auto;
}

#pic{
	text-align: center;
	height: 400px;
	padding: 20px;
}
Editado por Gugui - Ingo
Link para o comentário
Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...