Mam problem z rotacją zdjęć. Źle mi się wyświetlają. Do rotacji używam jquery. Link do pliku Link
Kod w php
mysql_query("SET NAMES 'latin2'"); $result = mysql_query("SELECT count(*) FROM users where id"); $do = mysql_fetch_row($result); $random = mt_rand(0,$do[0] - 1); $result = mysql_query("SELECT * FROM users LIMIT $random, 10"); while ($rowek = mysql_fetch_array($result)) { ?> </a> <? }
Nie wiem czy źle mam coś zrobione w rotacji funkcji.
Poniżej przedstawię cały kod jaki mam w pliku
Proszę was o pomoc
<!doctype html> <html> <head> <meta http-equiv="Content-Language" content="pl" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { //Execute the slideShow slideShow(); }); function slideShow() { //Set the opacity of all images to 0 $('#gallery a').css({opacity: 0.0}); //Get the first image and display it (set it to full opacity) $('#gallery a:first').css({opacity: 0.8}); //Set the caption background to semi-transparent $('#gallery .caption').css({opacity: 0.5}); //Resize the width of the caption according to the image width $('#gallery .caption').css({width: $('#gallery a').find('img').css('width')}); //Get the caption of the first image from REL attribute and display it $('#gallery .content').html($('#gallery a:first').find('img').attr('rel')) .animate({opacity: 0.7}, 400); //Call the gallery function to run the slideshow, 6000 = change to next image after 6 seconds setInterval('gallery()',6000); } function gallery() { //if no IMGs have the show class, grab the first image var current = ($('#gallery a.show')? $('#gallery a.show') : $('#gallery a:first')); //Get next image, if it reached the end of the slideshow, rotate it back to the first image var next = ((current.next().length) ? ((current.next().hasClass('caption'))? $('#gallery a:first') :current.next()) : $('#gallery a:first')); //Get next image caption var caption = next.find('img').attr('rel'); //Set the fade in effect for the next image, show class has higher z-index next.css({opacity: 0.0}) .addClass('show') .animate({opacity: 1.0}, 1000); //Hide the current image current.animate({opacity: 0.0}, 1000) .removeClass('show'); //Set the opacity to 0 and height to 1px $('#gallery .caption').animate({opacity: 0.0}, { queue:false, duration:0 }).animate({height: '1px'}, { queue:true, duration:300 }); //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect $('#gallery .caption').animate({opacity: 0.7},100 ).animate({height: '100px'},500 ); //Display the content $('#gallery .content').html(caption); } </script> <style type="text/css"> body{ font-family:arial } .clear { clear:both } #gallery { position:relative; height:360px } #gallery a { float:left; position:absolute; } #gallery a img { border:none; } #gallery a.show { z-index:500 } #gallery .caption { z-index:600; background-color:#000; color:#ffffff; height:100px; width:100%; position:absolute; bottom:0; } #gallery .caption .content { margin:5px } #gallery .caption .content h3 { margin:0; padding:0; color:#1DCCEF; } </style> </head> <body> <div id="gallery"> <? ?> </a> <? } // koniec if ;?><div class="caption"><div class="content"></div></div> </div> <div class="clear"></div> </body> </html>