CSS/PHP/HTML Random Rotate DIV

[DennisFr]

Hallo iedereen,

Ik heb een divje die ik wil laten rotaten tussen de -45 en 45deg. Nu heb ik gekeken bij CSS3 en helaas bestaat er geen functie zoals

-moz-transform: random(rotate(-45, 45deg))

Nu heb ik het geprobeerd om het direct in het php bestand te bewerken met php:

		<div class="post-it" style="-moz-transform: rotate(<?php rand(-45, 45);?>deg);" >
		
			<? print $line[2].'&nbsp;'; ?>
			<? print $line[3].'&nbsp;'; ?>
			<a href="edit.php?edit_id=<?php print $line[0] ?>"><img id="icon" src="images/edit.png" name="edit"></a>
			<a href="includes/delete.php?delete_id=<?php print $line[0] ?>" onclick="return confirm('Weet je zeker dat je het wil verwijderen?')"><img id="icon" src="images/delete.png" name="delete"></a><br />
			<? print '<b>'.$line[1].'</b><br />'; ?> 
			<? print $line[4];?>
		 </div>

Alleen dit werkt niet. misschien is het slimmer om op een andere manier te doen, ik sta open voor suggesties

Kan iemand mij helpen?

groeten,

Dennis

(Gebruik nu -moz- omdat ik even aan het testen ben in firefox)

 

[csshunter]

Hoi Dennis,
In php moet er even "echo" bij, anders wordt de uitkomst van het randomizen niet gebruikt.
En met javascript kan het ook.

• Test: rotate-met-php.php
• Test: rotate-met-javascript.htm
• Allebei dus Firefox-only in deze notatie!
• En er zijn browser(versie)s in omloop die helemaal niet aan rotatie doen, dus je kunt er voorlopig niet van op aan om dit cross-browser te krijgen. Maar natuurlijk wel alvast als extra'tje voor die browser(versie)s die de css3-rotate wel ondersteunen, al of niet met prefix.

Met vriendelijke groet,
CSShunter

[edit]O, of bedoel je dat de div ter plekke moet gaan draaien?[/edit]

 

[DennisFr]

Ah bedankt voor die php code! Je wilt niet weten hoelang ik heb lopen zuchten!

Resultaat:

Website