Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jquery] nie działa fadein
Forum PHP.pl > Forum > Przedszkole
grzegorz_g
mam oto taki slider:

  1.  
  2. <div id="slider">
  3. <div class="projector" id="img1">
  4.  
  5.  
  6.  
  7.  
  8.  
  9.  
  10. <img src="admin/media/img-upload/slider/min_f7b020c07ee5dccbc378f9a9d59ff8e5f352aa0f.jpg" id="foto" />
  11.  
  12. <div class="bg">
  13.  
  14. <div class="desc">
  15. <div class="block" id="cont">
  16.  
  17. <div class="title">Kolumna niskotonowa - HDS BR115F-TP</div>
  18.  
  19. <div class="desc1">Nasze nowe dziecko - HDS BR115F-TP - dostępna już w cenie <span style="font-weight: bold;">350 zł.! </span>Zapraszamy do zapoznania się z ofertą.</div>
  20.  
  21.  
  22. </div>
  23. </div>
  24. </div>
  25.  
  26.  
  27. </div>
  28.  
  29. <div class="navigator">
  30.  
  31. <ul>
  32.  
  33.  
  34.  
  35. <li><a href="admin/media/img-upload/slider/min_f7b020c07ee5dccbc378f9a9d59ff8e5f352aa0f.jpg" alt="Kolumna niskotonowa - HDS BR115F-TP" >Kolumna niskotonowa - HDS BR115F-TP<span></span></a>
  36. <div style="display:none;" class="bbb"><p class="title">Kolumna niskotonowa - HDS BR115F-TP</p>Nasze nowe dziecko - HDS BR115F-TP - dostępna już w cenie <span style="font-weight: bold;">350 zł.! </span>Zapraszamy do zapoznania się z ofertą.</div>
  37.  
  38.  
  39.  
  40. </li>
  41.  
  42.  
  43.  
  44.  
  45. <li><a href="admin/media/img-upload/slider/min_183f4fc17e12c47d6807705dcfab20be1e4d7632.jpg" alt="Kolumna niskotonowa - HDS xxx" >Kolumna niskotonowa - HDS xxx<span></span></a>
  46. <div style="display:none;" class="bbb"><p class="title">Kolumna niskotonowa - HDS xxx</p>Nowość w naszej ofercie - obudowa<span style="font-weight: bold;"> HDS BR115F-TP </span>już od <span style="font-weight: bold;">299 zł.!</span></div>
  47.  
  48.  
  49.  
  50.  
  51. </li>
  52.  
  53.  
  54.  
  55.  
  56. </ul>
  57. </div>
  58. </div>
  59.  
  60.  
  61.  
  62. <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
  63. <script type="text/javascript">
  64. $(document).ready(function() {
  65.  
  66. //Show Banner
  67. $(".projector .desc").fadeIn(); //Show Banner
  68. $(".projector .block").fadeIn(); //Set Opacity
  69.  
  70. //Click and Hover events for thumbnail list
  71. $(".navigator ul li:first").addClass('active');
  72. $(".navigator ul li").click(function(){
  73.  
  74.  
  75. //Set Variables
  76. var imgAlt = $(this).find('img').attr("alt"); //Get Alt Tag of Image
  77. var imgTitle = $(this).find('a').attr("href"); //Get Main Image URL
  78. var imgDesc = $(this).find('.bbb').html(); //Get HTML of block
  79.  
  80. var imgDescHeight = $(".projector").find('.block').height(); //Calculate height of block
  81.  
  82. if ($(this).is(".active")) { //If it's already active, then...
  83. return false; // Don't click through
  84. } else {
  85.  
  86.  
  87.  
  88.  
  89. $("#cont").html(imgDesc).fadeIn();
  90.  
  91.  
  92. $("#foto").attr({ src: imgTitle , alt: imgAlt}).fadeIn();
  93.  
  94.  
  95.  
  96.  
  97. }
  98.  
  99. $(".navigator ul li").removeClass('active'); //Remove class of 'active' on all lists
  100. $(this).addClass('active'); //add class of 'active' on this list only
  101. return false;
  102.  
  103. }) .hover(function(){
  104. $(this).addClass('hover');
  105. }, function() {
  106. $(this).removeClass('hover');
  107. });
  108.  
  109.  
  110.  
  111. });//Close Function
  112.  
  113.  


i przechodzenie obrazków działa ale nie wiem czemu nie występuje efekt fadeIn
ma ktoś z Was jakiś pomysł ?
grzegorz_g
nie znalazłem tam odpowiedz na moje pytanie

jak zrobić by te zdjęcia najpierw załadowały atrybuty a poźniej otworzyły się korzystając z np. fadein
erix
To nie była odpowiedź: wystaw swój skrypt na żywo, bo nikt nawet palcem nie kiwnie, żeby go przeanalizować. Nie wiem, jak Ty, ale ja najpierw korzystam z debuggera, potem analizuję kod. I podejrzewam, że nie tylko ja.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.