Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] ladowanie ajaxem do diva
Forum PHP.pl > Forum > XML, AJAX > AJAX
basu
Witam,

moj problem polega na tym ze ladujac stronę "normalnie" wyglada tak (chodzi o dzial fotografie): [

po zastosowaniu
  1. <?php
  2. $(document).ready(function() {
  3. $('#home_button').click(function() {
  4. $('#contents')
  5. .hide()
  6. .load('home/', function() {
  7. $(this).fadeIn();
  8. });
  9. });
  10. });
  11. ?>


dostaje cos takiego (fotografie sa przyciete i skrypt jquery zawarty w nim nie dziala):

kawalek htmla (div do fotografii, ktorego nie wyswietla):

  1. <div id="featured-books">
  2. <div class="covers">
  3. <a href="covers/large/1847190871.jpg" title="Community Server Quickly">
  4. <img src="media/gfx/photography_1.jpg" width="157" height="96" alt="Community Server Quickly" />
  5. <span class="price">$35.99</span>
  6. </a>
  7. <a href="covers/large/1847190901.jpg" title="Deep Inside osCommerce: The Cookbook">
  8. <img src="media/gfx/photography_1.jpg" width="157" height="96" alt="Community Server Quickly" />
  9. <span class="price">$44.99</span>
  10. </a>
  11. <a href="covers/large/1847190979.jpg" title="Learn OpenOffice.org Spreadsheet Macro Programming: OOoBasic and Calc automation">
  12. <img src="media/gfx/photography_1.jpg" width="157" height="96" alt="Community Server Quickly" />
  13. <span class="price">$35.99</span>
  14. </a>
  15. <a href="covers/large/1847190987.jpg" title="Microsoft AJAX C# Essentials: Building Responsive ASP.NET 2.0 Applications">
  16. <img src="media/gfx/photography_1.jpg" width="157" height="96" alt="Community Server Quickly" />
  17. <span class="price">$31.99</span>
  18. </a>
  19. </div>
  20. </div>



moze podam jeszcze css do tego:
  1. #featured-books {
  2. position: relative;
  3. width: 400px;
  4. height: 76px;
  5. overflow: scroll;
  6. margin-left: 23px;
  7. padding: 0;
  8. text-align: center;
  9. z-index: 2;
  10. }
  11.  
  12. #featured-books .covers {
  13. position: relative;
  14. width: 840px;
  15. z-index: 1;
  16. }
  17.  
  18. #featured-books a {
  19. float: left;
  20. margin: 10px;
  21. height: 76px;
  22.  
  23. }
  24.  
  25. #featured-books .price {
  26. display: none;
  27. }
  28.  
  29. #featured-books .control {
  30. position: absolute;
  31. z-index: 3;
  32. left: 40px;
  33. top: 10px;
  34. }
  35.  
  36. img.enlarged {
  37. position: absolute;
  38. z-index: 5;
  39. cursor: pointer;
  40. }
  41.  
  42. img.enlarged-control {
  43. position: absolute;
  44. z-index: 6;
  45. cursor: pointer;
  46. }
  47.  
  48. .enlarged-price {
  49. background-color: #373c40;
  50. color: #fff;
  51. width: 80px;
  52. padding: 5px;
  53. font-size: 18px;
  54. font-weight: bold;
  55. text-align: right;
  56. position: absolute;
  57. z-index: 6;
  58. }
  59.  
  60.  
  61. .sidewiper {
  62. position: relative;
  63. border: 1px solid #ccc;
  64. height: 300px;
  65. }
  66.  
  67. #content .sidewiper h3 {
  68. position: relative;
  69. width: 20px;
  70. float: left;
  71. height: 280px;
  72. background-color: #15b;
  73. background-repeat: no-repeat;
  74. color: #fff;
  75. border-right: 1px solid #fff;
  76. }
  77.  
  78. #content .sidewiper div {
  79. position: relative;
  80. width: 300px;
  81. padding: 10px;
  82. height: 260px;
  83. float: left;
  84. }


dodatkowo jest plik jQuery do obslugi, ale moze podam go pozniej jak bedzie potrzebny smile.gif. Po zaladowaniu ajaxem, skrypt nie chodzi ani nie wyglada poprawnie. Kod jest z ksiazki i nie pozmienialem jeszcze nazw, co moze troche mylic, ale ogolnie przyklad chodzi wczytywany "normalnie". Co z tym zrobic?
woj_tas
Fajnie by było jakbyś podał url-a do strony. Na pierwszy rzut oka wydaje sie ze funkcja ładuje strone i zamiast zastępować text w danym divie (w twoim przypadku obrazki) do ona dodaje do istniejącej już treści. Spróbuj usunąć funkcję .hide().
basu
nic to nie dalo, ladujac do diva zawartosc - dalej niepoprawnie wyswietla zawartosc.

plik mam podzielony na 3 czesci: banner, tresc i stopke, do diva content laduje po prostu srodek strony w zaleznosci od podstrony.
klikajac na kontakt, laduje ajaxem zawartosc kontaktu, wszystko jest ok. Tylko ladujac zawartosc pokazana na rysunku sypie sie

moze chodzi o to, ze zwracajac htmla przez ajax, strona nie wykonuje kodu js. Jednak js jest podpiety w <head>, a kod na ktorym ma byc operacja js jest zwracany, ale nie wykonywany. Jak to zrobic w jQuery?
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.