2014-10-11 101 views
1

我幾乎完成創建一個整潔的用戶配置文件頁面,其中用戶可以觀看他們的個人資料。我正在使用集成在WordPress中的Bootstrap框架。我使用Bootstrap's Tabs爲了獲得一個很多的信息,但保持清楚的用戶。 我有兩個主標籤,名爲「AWF I」和「AWF II」,在這些標籤中我有關於該基金的信息,以及用於顯示圖片的貓頭鷹旋轉木馬 The AWF I tab is active here 正如您所看到的旋轉木馬很棒,但是當我激活標籤「AWF II」我得到這個: The AWF II tab is active here 正如你所看到的,圖片/旋轉木馬本身超小,我不知道如何克服這一點,旋轉木馬應該顯示爲像「AWF I」標籤。 下面是可能給你們,爲什麼這種情況正在發生一些想法線索:當我點擊右鍵並檢查在谷歌瀏覽器的元素,轉盤彈出,以正確的大小像它應該是: The correct display should be this 當我切換回到「AWF I」之後,該傳送帶顯示小圖像,因此基本上,使用谷歌瀏覽器進行檢查會使其轉換角色。貓頭鷹旋轉木馬問題與引導標籤

任何線索?如果您需要更多信息,請讓我知道!謝謝!

UPDATE 01

這裏是我用來調用轉盤代碼:

$(document).ready(function(){ 

$("#owl-awf1-properties,#owl-awf2-properties").owlCarousel({ 
    pagination: true, 
    loop: true, 
    dots: false, 
    autoplay: true, 
    autoplayTimeout:2000, 
    autoplayHoverPause:true, 
    margin:10, 
    responsiveClass:true, 
    responsive:{ 
     0: { 
      items:2 
     }, 
     450:{ 
      items:3 
     }, 
     767:{ 
      items:4 
     }, 
     991:{ 
      items:5 
     }, 
     1199:{ 
      items:5 
     } 
    } 
}); 

}); 
+0

你不會在頁面加載時不使用Owl Carousel,它需要實際調整大小才能工作,或者它在頁面加載時工作,如果它在頁面加載時未加載的東西內部標籤面板或面板組內容),那麼它將不起作用。貓頭鷹傳送帶響應,但它不流暢,它通過使用jQuery的響應,但不通過使用媒體查詢。 – Christina 2014-10-11 13:29:33

+0

http://jsfiddle.net/Epmwx/ - 做一個小提琴,看看你是否可以複製它,以便你可以得到幫助。 – Christina 2014-10-11 13:43:05

+0

謝謝!至少我們現在知道這是因爲頁面的加載。是否有一些jQuery我們可以使用並綁定到標籤按鈕強制輪播工作?我更新了小提琴和內置的圖像,它的工作原理是正確的,如果我們不能在沒有小提琴的情況下弄清楚它,我會盡我所能複製它,但這會很難,因爲我使用循環和東西。感謝迄今! – 2014-10-11 15:22:37

回答

2

@Jason Anello,在www.teamtreehouse.com國防部通過建議來解決這個問題從貓頭鷹旋轉木馬2切換到更老,但更穩定的貓頭鷹旋轉木馬1!我將我的css和js文件從版本2更改爲版本1,現在輪播加載就像他們應該那樣!謝謝賈森!

謝謝克里斯蒂娜也試圖幫助!

+0

您是否找到其他類型的解決方案?在我的情況下,切換到版本1是不可能的。 – zekia 2015-03-17 14:09:03