2010-05-27 29 views
10

我正在使用jquery-ui,並且在某些時候,我使用顯示和隱藏功能來進行動態變化的圖像進出。jquery ui-effects-wraper造成破壞

出於某種原因,在幾次嘗試之後,突然我的網頁上的控件停止響應點擊。在使用螢火蟲周圍兜了一下之後,我發現我的頁面上充滿了該類的div's ui-effects-wrapper

我不知道爲什麼會發生這種情況或如何阻止它。如果我刪除這些div,我無法再看到我一直在動畫的圖像。

任何想法?

+1

您的HTML有效嗎?如果不是那麼元素刪除將遍佈整個地方,請在此處檢查有效性:http://validator.w3.org/ – 2010-05-27 21:11:26

+0

爲什麼與項目刪除相關的有效性?我無法解決這個問題。我在我的網站上使用了Facebook控件,並且他們的控件不是w3有效= [還有其他想法? – vondip 2010-05-27 23:51:14

回答

3

ui-effects-wrapper是由jQuery UI效果插件添加的。

這裏是從jquery.effects.core.js採取了一些代碼:

// Wraps the element around a wrapper that copies position properties 
createWrapper: function(element) { 

    // if the element is already wrapped, return it 
    if (element.parent().is('.ui-effects-wrapper')) { 
     return element.parent(); 
    } 

    // wrap the element 
    var props = { 
      width: element.outerWidth(true), 
      height: element.outerHeight(true), 
      'float': element.css('float') 
     }, 
     wrapper = $('<div></div>') 
      .addClass('ui-effects-wrapper') 
      .css({ 
       fontSize: '100%', 
       background: 'transparent', 
       border: 'none', 
       margin: 0, 
       padding: 0 
      }); 

    element.wrap(wrapper); 
    wrapper = element.parent(); //Hotfix for jQuery 1.4 since some change in wrap() seems to actually loose the reference to the wrapped element 

    // transfer positioning properties to the wrapper 
    if (element.css('position') == 'static') { 
     wrapper.css({ position: 'relative' }); 
     element.css({ position: 'relative' }); 
    } else { 
     $.extend(props, { 
      position: element.css('position'), 
      zIndex: element.css('z-index') 
     }); 
     $.each(['top', 'left', 'bottom', 'right'], function(i, pos) { 
      props[pos] = element.css(pos); 
      if (isNaN(parseInt(props[pos], 10))) { 
       props[pos] = 'auto'; 
      } 
     }); 
     element.css({position: 'relative', top: 0, left: 0, right: 'auto', bottom: 'auto' }); 
    } 

    return wrapper.css(props).show(); 
}, 
0

在一個功能,我有一些代碼,切換的兩個按鈕和所使用的效果,如fadeTo和彈跳的可見性。偶爾會有一個包裝剩餘。 我試着將這個添加到我的方法中,這個想法是在效果排隊後的1.1秒後它會移除包裝。

setTimeout('$(".ui-effects-wrapper").children().unwrap();', 1100); 

這將刪除陳舊的包裝,但有可能它也可以刪除用於效果的後續包裝。

我對看到這項技術的改進很感興趣。

+1

你可以做的一件事是在隱藏方法中使用回調函數,並將你的調用打開。 – 2016-08-16 21:41:57