Hello all,
I found this great tut at: An Awesome CSS3 Lightbox Gallery With jQuery | Tutorialzine which entails building a poloroid random scattering and rotating of images photo gallery. Unfortunately the rotating does not work with ie7 and yes i would like it to, besides being a good learning project.
The php code used is:
/* Configuration Start */
02 $thumb_directory = 'img/thumbs';
03 $orig_directory = 'img/original';
04 $stage_width=600;
05 $stage_height=400;
06 /* Configuration end */
07
08 $allowed_types=array('jpg','jpeg','gif','png');
09 $file_parts=array();
10 $ext='';
11 $title='';
12 $i=0;
13
14 /* Opening the thumbnail directory and looping through all the thumbs: */
15 $dir_handle = @opendir($thumb_directory) or die("There is an error with your image directory!");
16 $i=1;
17
18 while ($file = readdir($dir_handle))
19 {
20 /* Skipping the system files: */
21 if($file=='.' || $file == '..') continue;
22
23 $file_parts = explode('.',$file);
24 $ext = strtolower(array_pop($file_parts));
25
26 /* Using the file name (withouth the extension) as a image title: */
27 $title = implode('.',$file_parts);
28 $title = htmlspecialchars($title);
29
30 /* If the file extension is allowed: */
31 if(in_array($ext,$allowed_types))
32 {
33 /* Generating random values for the position and rotation: */
34 $left=rand(0,$stage_width);
35 $top=rand(0,400);
36 $rot = rand(-40,40);
37
38 if($top>$stage_height-130 && $left > $stage_width-230)
39 {
40 /* Prevent the images from hiding the drop box */
41 $top-=120+130;
42 $left-=230;
43 }
44
45 /* Outputting each image: */
46 echo '
47 <div id="pic-'.($i++).'" class="pic" style="top:'.$top.'px;left:'.$left.'px;background:url('.$thumb_directory.'/'.$file.') no-repeat 50% 50%; -moz-transform:rotate('.$rot.'deg); -webkit-transform:rotate('.$rot.'deg);">
48
49 <a class="fancybox" rel="fncbx" href="'.$orig_directory.'/'.$file.'" target="_blank">'.$title.'</a>
50
51 </div>';
52 }
53 }
54
55 /* Closing the directory */
56 closedir($dir_handle);
But this does not work in ie7! In the comments this code is mentioned:
$deg2radians = pi() * 2 / 360;
$rad = $rot * $deg2radians;
$cosTheta = cos($rad);
$sinTheta = sin($rad);
Then we can use it in the style property:
filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod=\\’auto expand\\’, M11=’.$cosTheta.’,M12=’.-$sinTheta.’,M21=’.$sinTheta.’,M22=’.$cosTheta.’);
Unfortunately after that is: “Full code:” with nothing more. I’ve tried putting the code into the php code a few different times and ways with no success. Any help would be appreciated.
PChuprina:confused: