Forum Mjukvara Programmering och digitalt skapande Tråd

Slumpa bild från mapp.

1
Skriv svar
Permalänk
Medlem ★
●

Slumpa bild från mapp.

Hej!
Jag skulle vilja göra så att min hemsida slumpar fram bilder som ändras exempelvis var 10:e sekund från en mapp ,
är detta möjligt?
Det kan inte vara en lösning där hela sidan laddas om då det kommer ha annat innehåll.
Jag har för mig att jag har läst någonstans att det ska gå att göra i php, men jag hittar tyvärr inte tillbaka dit.

Visa signatur

Lurkar - läser mycket skriver lite. Vill du få min uppmärksamhet är det citat eller pm som gäller.
Jag anser att AIO-kylare har en plats i världen men det är INTE i fullstora ATX-system.

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Litenskit:

Hej!
Jag skulle vilja göra så att min hemsida slumpar fram bilder som ändras exempelvis var 10:e sekund från en mapp ,
är detta möjligt?
Det kan inte vara en lösning där hela sidan laddas om då det kommer ha annat innehåll.
Jag har för mig att jag har läst någonstans att det ska gå att göra i php, men jag hittar tyvärr inte tillbaka dit.

Gå till inlägget

Det är inte möjligt med enbart PHP att göra utan att ladda om sidan. Du får använda ajax och jquery för att göra det utan att ladda om.
Har inte testat detta men borde vara något liknande som kan fungera.

get_bild.php

<?php
$imagesDir = 'images/'; //Sökväg till bilderna

$images = glob($imagesDir . '*.{jpg,jpeg,png,gif}', GLOB_BRACE);

$randomImage = $images[array_rand($images)];

echo $randomImage; //Skriv ut den slumpade bilden
?>

jquery-kod att lägga i filen som ska ha bilderna

<script>
 $(document).ready(function() {
 	 $("#bild_div").load("get_bild.php");
         var refreshId = setInterval(function() {
                 $("#bild_div").load('get_bild.php');
         }, 10000); //Ladda om var 10:e sekund
});
</script>

Hoppas det hjälper

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av agentq15:

Det är inte möjligt med enbart PHP att göra utan att ladda om sidan. Du får använda ajax och jquery för att göra det utan att ladda om.
Har inte testat detta men borde vara något liknande som kan fungera.

...

Gå till inlägget

Tyvärr så fick jag det inte att fungera. Här får du länk till de båda sidorna som jag gjort:

http://lillavm.se/get_bild.php

samt http://lillavm.se/test.php

Visa signatur

Lurkar - läser mycket skriver lite. Vill du få min uppmärksamhet är det citat eller pm som gäller.
Jag anser att AIO-kylare har en plats i världen men det är INTE i fullstora ATX-system.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Du har ju ingen img tag, självklart visas det ingen bild då.

echo "<img src='". $randomImage ."'></a>";

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Litenskit:

Tyvärr så fick jag det inte att fungera. Här får du länk till de båda sidorna som jag gjort:

http://lillavm.se/get_bild.php

samt http://lillavm.se/test.php

Gå till inlägget

Du måste ju inkludera jQuery-paketet. Ladda ner och inkludera: http://code.jquery.com/jquery-1.9.1.min.js

Sen har du ingen div som har id="bild_div"

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av pettiz:

Du har ju ingen img tag, självklart visas det ingen bild då.

echo "<img src='". $randomImage ."'></a>";

Gå till inlägget
Skrivet av agentq15:

Du måste ju inkludera jQuery-paketet. Ladda ner och inkludera: http://code.jquery.com/jquery-1.9.1.min.js

Sen har du ingen div som har id="bild_div"

Gå till inlägget

Nu fick jag det att fungera, tack för hjälpen! Så här var lösningen för den som kanske söker sig hit:

I fil som ska visa bilder:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="includes/jquery-1.9.1.min.js"></script>
</head>

<body>

<div id="bild_div">  

<script>
 $(document).ready(function() {
 	 $("#bild_div").load("get_bild.php");
         var refreshId = setInterval(function() {
                 $("#bild_div").load('get_bild.php');
         }, 1000); //Ladda om var 1:e sekund
});
</script>
</div>
</body>

I get_bild.php:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>

<?php 
$imagesDir = 'projbilder/'; //Sökväg till bilderna 

$images = glob($imagesDir . '*.{jpg,jpeg,png,gif}', GLOB_BRACE); 

$randomImage = $images[array_rand($images)]; 

echo "<img src='". $randomImage ."'></a>";
?>

</body>
</html>
Senast redigerat
Visa signatur

Lurkar - läser mycket skriver lite. Vill du få min uppmärksamhet är det citat eller pm som gäller.
Jag anser att AIO-kylare har en plats i världen men det är INTE i fullstora ATX-system.

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av Litenskit:

Nu fick jag det att fungera, tack för hjälpen! Så här var lösningen för den som kanske söker sig hit:

Kod m.m

Gå till inlägget

Nästan. Lite småfel som jag ändrat för en mer korrekt kod.

Filen som ska visa bilder:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>

<div id="bild_div"></div>

<script type="text/javascript" src="includes/jquery-1.9.1.min.js"></script>
<script>
 $(document).ready(function() {
 	 $("#bild_div").load("get_bild.php");
         var refreshId = setInterval(function() {
                 $("#bild_div").load('get_bild.php');
         }, 1000); //Ladda om varje sekund (1000ms)
});
</script>
</body>
</html>

I get_bild.php:

<?php 
$imagesDir = 'projbilder/'; //Sökväg till bilderna 

$images = glob($imagesDir . '*.{jpg,jpeg,png,gif}', GLOB_BRACE); 

$randomImage = $images[array_rand($images)]; 

echo "<img src='". $randomImage ."'>";
?>
Redigera
Citera flera Citera
1
Skriv svar
Senaste nyheterna
Hårdvara
Mjukvara
Övrigt
Nytt i forumet
Datorkomponenter
System
Ljud, bild och kommunikation
Spel och mjukvara