[risolto] Div random ogni refresh

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
Salve a tutti

in un sito che sto facendo index.html, ho tre colonne, ed in ogni colonna c'è un titolo ed una immagine tipo cosi:


HTML:
<div class="colonna1"> 

<h1> titolo </h1>

<img bla bla bla />

</div>

<div class="colonna2"> 

<h1> titolo </h1>

<img bla bla bla />

</div>

<div class="colonna3"> 

<h1> titolo </h1>

<img bla bla bla />

</div>
volevo sapere se ci fosse uno script che faccia in modo che ad ogni refresh faccia cambiare in modo casuale posto ai div, tipo la colonna 3 va al posto 1, la colonna 1 invece alla colonna 2 e cosi via. Anche se oltre questi div, ci sono altri con la stessa class? e se fosse possibile implementarlo nella stessa pagina .html
 
Ultima modifica:

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
potresti provare così, ad ogni refresh
il primo div assume casualmente una classe, il secondo un'altra e il terzo un'altra ancora
PHP:
<?php
$colonne=array('colonna1','colonna2','colonna3');
sort($colonne);
?>
<div class="<?php echo $colonna[0]; ?>"> 
<h1> titolo </h1>
<img bla bla bla />
</div>
<div class="<?php echo $colonna[1]; ?>"> 
<h1> titolo </h1>
<img bla bla bla />
</div>
<div class="<?php echo $colonna[2]; ?>"> 
<h1> titolo </h1>
<img bla bla bla />
</div>
 

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
ciao
potresti provare così, ad ogni refresh
il primo div assume casualmente una classe, il secondo un'altra e il terzo un'altra ancora
PHP:
<?php
$colonne=array('colonna1','colonna2','colonna3');
sort($colonne);
?>
<div class="<?php echo $colonna[0]; ?>"> 
<h1> titolo </h1>
<img bla bla bla />
</div>
<div class="<?php echo $colonna[1]; ?>"> 
<h1> titolo </h1>
<img bla bla bla />
</div>
<div class="<?php echo $colonna[2]; ?>"> 
<h1> titolo </h1>
<img bla bla bla />
</div>

ciao Borgo Italia :) Prima di tutto grazie dell'aiuto

ho fatto come hai detto tu, ma non funge :( non so dove sbaglio

ho rinomato la pagina da index.html ad index.php


ho messo come hai scritto tu, con la differenza di column che colonna ( dato che l'ho messo in english )



HTML:
 <?php
 
$column=array('column1','column2','column3'); 

sort($column); 

?> 



       <div class="<?php echo $column[0]; ?>">

			  <h2>TITLE </h2>
				  
				<a href="#"><img src="http://forum.mrwebmaster.it/images/IMG1.jpg" width="250" height="215" alt="" /></a>
				
		  </div>

			<div class="<?php echo $column[1]; ?>">

				<h2>TITLE </H2>
				  
				<a href="#"><img src="http://forum.mrwebmaster.it/images/IMG2.jpg" width="250" height="215" alt="" /></a>
				
		  </div>

          <div class="<?php echo $column[2]; ?>">

				<h2>TITLE </H2>

				<a href="#"><img src="http://forum.mrwebmaster.it/images/IMG3.jpg" width="250" height="215" alt="" /></a>
				
		  </div>

mi sono perso magari qualche passaggio? Mi devi scusare ma sono alle prime armi con php :(

Può essere che eseguendolo in locale non vada?

oppure ho sbagliato nel sort?

oppure che siano classi che sono contenute in un grande div #contaneir ?
 
Ultima modifica:

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
per prima cosa guarda con tool->web developper->page source se usi firefox o simile se usi ie o chrome.
dovresti vedere la prima volta che lanci la pagina (es)
HTML:
<div class="column3">
	<h2>TITLE </h2>
	<a href="#"><img src=" images/IMG1.jpg" width="250" height="215" alt="" /></a>
</div>
<div class="colum2">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/IMG2.jpg" width="250" height="215" alt="" /></a>
</div>
<div class="column1">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/IMG3.jpg" width="250" height="215" alt="" /></a>
</div>
cioè le classi con i div nescolati, refreshi la pagina e riguardi il sorgente
dovresti vedere un cosa diversa al primo div e cosi via per gli altri
prova e sappimi dire
a parte, forse è meglio, randomizzare le immagini in modo da non spostare i div, eventualmente prova così
PHP:
<?php
$img=array('IMG1.jpg','IMG2.jpg','IMG.jpg'); 
sort($img); 
?>
<div class="column1">
	<h2>TITLE </h2>
	<a href="#"><img src=" images/<?php echo $img[0]; ?>" width="250" height="215" alt="" /></a>
</div>
<div class="colum2">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/<?php echo $img[1]; ?>" width="250" height="215" alt="" /></a>
</div>
<div class="column3">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/<?php echo $img[2]; ?>" width="250" height="215" alt="" /></a>
</div>
in locale o remoto deve funzionare lo stesso e non stai sbagliando il sort perche è una semplice funzione nativa di php che mescola l'array (come un mazzo di carte)
se devi poi randomizzare (penso) anche il TITLE (immagino che sia diverso) allora convine mettre nell'array tutto il contenuto del div
 

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
ciao
per prima cosa guarda con tool->web developper->page source se usi firefox o simile se usi ie o chrome.
dovresti vedere la prima volta che lanci la pagina (es)
HTML:
<div class="column3">
	<h2>TITLE </h2>
	<a href="#"><img src=" images/IMG1.jpg" width="250" height="215" alt="" /></a>
</div>
<div class="colum2">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/IMG2.jpg" width="250" height="215" alt="" /></a>
</div>
<div class="column1">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/IMG3.jpg" width="250" height="215" alt="" /></a>
</div>
cioè le classi con i div nescolati, refreshi la pagina e riguardi il sorgente
dovresti vedere un cosa diversa al primo div e cosi via per gli altri
prova e sappimi dire
a parte, forse è meglio, randomizzare le immagini in modo da non spostare i div, eventualmente prova così
PHP:
<?php
$img=array('IMG1.jpg','IMG2.jpg','IMG.jpg'); 
sort($img); 
?>
<div class="column1">
	<h2>TITLE </h2>
	<a href="#"><img src=" images/<?php echo $img[0]; ?>" width="250" height="215" alt="" /></a>
</div>
<div class="colum2">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/<?php echo $img[1]; ?>" width="250" height="215" alt="" /></a>
</div>
<div class="column3">
	<h2>TITLE </H2>
	<a href="#"><img src=" images/<?php echo $img[2]; ?>" width="250" height="215" alt="" /></a>
</div>
in locale o remoto deve funzionare lo stesso e non stai sbagliando il sort perche è una semplice funzione nativa di php che mescola l'array (come un mazzo di carte)
se devi poi randomizzare (penso) anche il TITLE (immagino che sia diverso) allora convine mettre nell'array tutto il contenuto del div

Grazie ancora dell'aiuto :)
Ma niente da fare :(
ho provato con le immagini, ma rimangono fisse, ed aggiornando su chrome con ispeziona elemento e visualizza sorgente pagina , quest'ultima rimane invariata, non si scambiano le immagini ( ed ho provato anche con le classi )

cosa può essere? magari ho qualche dettaglio sbagliato in xampp?

questo è il codice:

ho provato sia a mettere ('IMG1.jpg','IMG2.jpg','IMG3.jpg'); e sia senza il 3

HTML:
<div id="three-column">

<?php
$img=array('IMG1.jpg','IMG2.jpg','IMG3.jpg'); 
sort($img); 
?>

			<div class="column1">
				<h2>DISPONIBILE
				  
				</h2>
				<a href="#"><img src="http://forum.mrwebmaster.it/images/<?php echo $img[0]; ?>" width="250" height="215" alt="" /></a>
				
		  </div>
          
			<div class="column2">
			  <h2>DISPONIBILE
				  </h2>
				<a href="#"><img src="http://forum.mrwebmaster.it/images/<?php echo $img[1]; ?>" width="250" height="215" alt="" /></a>
				
		  </div>
			<div class="column3">
				<h2>PROVA </h2><a href="#"><img src="http://forum.mrwebmaster.it/images/<?php echo $img[2]; ?>" width="250" height="215" alt="" /></a>

</div>
</div>

ho fatto pure un video:

[video=youtube;Oti9rOk8jPA]http://www.youtube.com/watch?v=Oti9rOk8jPA&feature=youtu.be[/video]
 
Ultima modifica:

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
scusa l'arteriosclerosi
al posto di sort metti shuffle
PHP:
<?php
$img=array('IMG1.jpg','IMG2.jpg','IMG.jpg'); 
shuffle($img); 
?>
 

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
Grazie :love:

Provato con le immagini ed ora lo sto provando con 5 div e va una meraviglia :D
 

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
Ho un ultima curiosità:

1) Essendo che ho tre colonne, ho fatto la colonna sinistra e centrale che abbiano un margin verso destra, mentre quella a destra non ha nessun margine.

posso usare due script, in cui, uno si occupa della colonna sinistra e centrale, e l'altro solo della colonna a destra? Perche' ho paura che andandosi a randomizzare, la colonna destra vada in quella centrale, e diventando una cosa brutta da vedere
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
per quello ti avevo scritto che era meglio cambiare il contenuto invece delle classi del div
ti faccio un esempio:
PHP:
<?php
//qui devi stare attento a come scrivi i valori dell'array
$contenuto=array("<h2>titolo 1</h2>
				  <a href=\"#\"><img src=\" images/IMG1.jpg\" width=\"250\" height=\"215\" alt=\"\" /></a>",
				 "<h2>titolo 2</h2>
				  <a href=\"#\"><img src=\" images/IMG2.jpg\" width=\"250\" height=\"215\" alt=\"\" /></a>",
				 "<h2>titolo 3</h2>
				  <a href=\"#\"><img src=\" images/IMG3.jpg\" width=\"250\" height=\"215\" alt=\"\" /></a>");
shuffle($contenuto);
?>
<div class="column1">
	<?php echo $contenuto[0]; ?>
</div>
<div class="column2">
	<?php echo $contenuto[1]; ?>
</div>				 
<div class="column3">
	<?php echo $contenuto[2]; ?>
</div>
se ci pensi con un sistema del genere potresti fare tutto in automatico con php anche prelevando anche i vari contenuti da una tabella di un database
 

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
ciao
per quello ti avevo scritto che era meglio cambiare il contenuto invece delle classi del div
ti faccio un esempio:
PHP:
<?php
//qui devi stare attento a come scrivi i valori dell'array
$contenuto=array("<h2>titolo 1</h2>
				  <a href=\"#\"><img src=\" images/IMG1.jpg\" width=\"250\" height=\"215\" alt=\"\" /></a>",
				 "<h2>titolo 2</h2>
				  <a href=\"#\"><img src=\" images/IMG2.jpg\" width=\"250\" height=\"215\" alt=\"\" /></a>",
				 "<h2>titolo 3</h2>
				  <a href=\"#\"><img src=\" images/IMG3.jpg\" width=\"250\" height=\"215\" alt=\"\" /></a>");
shuffle($contenuto);
?>
<div class="column1">
	<?php echo $contenuto[0]; ?>
</div>
<div class="column2">
	<?php echo $contenuto[1]; ?>
</div>				 
<div class="column3">
	<?php echo $contenuto[2]; ?>
</div>
se ci pensi con un sistema del genere potresti fare tutto in automatico con php anche prelevando anche i vari contenuti da una tabella di un database
Scusa se rispondo ora ma ho avuto il week end impegnato :(

Comunque sia credo che sia meglio cosi, cambiare contenuti invece che proprio i div :) Dopo lo provo! Grazie ancora infinitamente ! Se ti conoscessi dal vivo ti offrirei 9304920 caffè :D
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
PHP:
ti offrirei 9304920 caffè
poi divento nervoso :)

dimenticavo: sappimi dire poi se funzia il tutto
 
Ultima modifica:

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
ciao
PHP:
ti offrirei 9304920 caffè
poi divento nervoso :)

dimenticavo: sappimi dire poi se funzia il tutto

Funziona alla perfezione :D

Un ultima domanda ignorante: Per metterlo online, devo per forza avere index.php invece di index.html vero?

Comunque sia grazie tante :eek: è spettacolare il php !
 

lsnight

Nuovo Utente
15 Ott 2013
25
0
0
ciao
PHP:
ti offrirei 9304920 caffè
poi divento nervoso :)

dimenticavo: sappimi dire poi se funzia il tutto

non posso modificare il mio reply sopra, comunque sia, c'è un piccolo problema.Mettiamo che in tutto questo, che funziona alla grande, ci fosse la possibilità di mettere il mouseover per far specie una gallery di immagini ( 4 ) , è possibile? in questo caso che dici, è meglio modificare il div?

tipo io ho questo codice per il mouse over:

HTML:
<div class="column1">
				<h2>Immagine 1
				  
				</h2>
				<a onmouseover="change('swap1')" onmouseout="stop('swap1')" href="img1.html">
        <img id="swap1" src=" images/img1.jpg" alt="" /></a>
				
		  </div>
e questo il suo codice java
Codice:
<script type="text/javascript">  
  
    var img = new Array();
    img['swap1'] = ["img1.jpg","img2.jpg","img3.jpg","img4.jpg"];
    img['swap2'] = ["img4.jpg","img3.jpg","img2.jpg","img1.jpg"];   

    function change(id) {
        var i = 0;
        go = setInterval(function(){
            document.getElementById(id).src = "http://forum.mrwebmaster.it/images/" + img[id][i];
            if(i == img[id].length - 1) {
                i = 0;
            }else{
                i++;
            }
        },450);        
    }

    function stop(id) {
        clearInterval(go);
        document.getElementById(id).src = "http://forum.mrwebmaster.it/images/" + img[id][0];
    }
</script>
 
Ultima modifica:

Alessandro.b

Nuovo Utente
29 Ott 2013
1
0
0
Ciao a tutti, io vorrei realizzare una cosa simile nel mio sito e ho trovato molto utili le vostre spiegazioni.

Io vorrei creare però un solo contenuto che cambia a ogni refresh e vorrei chiedervi un parere a riguardo; secondo voi in questo caso come si comporta l'indicizzazione di google? Indicizza correttamente tutti i testi? O può penalizzare visto che quando compare un testo, gli altri non sono visibili?
Grazie!
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.042
146
63
PR
www.borgo-italia.it
ciao
se usi il sistema spigato google non vede i testi "nascosti", google legge solo l'html, quindo solo i testi che appaiano.
sino a che sono nel php non li vede