jquery innerfade插件騎css

jquery插件innerfade已經結束了我的css樣式的保證金。無法重新對齊。jquery innerfade插件騎css

CSS：

.changer{ 
    margin: 0 auto; 
    font-size: 2em; 
    font-weight: bold; 
}

HTML：

<div class='changer'> 
    <p>Am a <span class='highlight1'>Web Maker </span></p> 

    <p>Am a <span class='highlight1'>Windows Phone Dev</span></p> 

    <p>Am a <span class='highlight1'>Reverse Engineer</span></p> 

    <p>Am an <span class='highlight1'>UI/UX Lover </span></p> 

    <p>Am a <span class='highlight1'>Geek</span></p> 

    <p>Am a <span class='highlight1'>Human </span></p> 
</div>

JQuery的：

$(document).ready(
    function(){ 
     $('.changer').innerfade({ 
      animationtype: 'slide', 
      speed: 750, 
      timeout: 2000, 
      type: 'sequence', 
      containerheight: '1em' 
     }); 
});

請注意，此代碼不會工作直到你添加innerfade插件，所以請注意，如果你正在測試代碼。謝謝。

來源

2015-05-07 Alok Rajasukumaran

那麼試着添加'！important'到你的'css'！ –

@guruprasad Rao。，已經試過了，不行。 –

使用此插件時，我看不出邊距有任何問題：http://jsfiddle.net/dekkard/37zutmsk/。我錯過了什麼嗎？ – dekkard

在你innerFade.js插件找到下面一行[可能是83號線]：

// Set the z-index from highest to lowest (20, 19, 18...), hide everything and set position as absolute 
for (var i = 0; i < $fade_object.elements.length; i++) { 
     $($fade_object.elements[i]).hide(0).css('z-index', String($fade_object.elements.length-i)).css('position', 'absolute'); 
}

和改變內部for loop如下內容：

$($fade_object.elements[i]).hide(0).css('z-index', String($fade_object.elements.length-i)).css('position', 'absolute').css('text-align','center').css('width','100%');

我的建議在這裏，的當絕對定位時，div並不佔用所有可用的水平空間。顯式設置寬度爲100％將解決問題。因此，您需要修改插件併爲您的position:absolute內容設置2個更多屬性，text-align:center和width:100%。這將做到這一點。

上述解決方案已經過測試併發布到此處。

來源

2015-05-07 12:32:22

以下是唯一的for循環。這是你的意思嗎？（var i = 0; i

，這也沒有爲我工作 –

和唯一似乎工作的是保證金 –

jquery innerfade插件騎css

回答

相關問題