創建一個div，它會像泡沫一樣增長

我在div內有一個圓形背景圖像。開始我不需要顯示'氣泡'。在到達該頁面之後，泡泡會像泡泡一樣長出來，或者換句話說就是「流行」到位。我不知道如何去jQuery中創建這個。這也需要工作，所有的瀏覽器IE7，包括任何+幫助，將不勝感激創建一個div，它會像泡沫一樣增長

來源

2011-09-14 saunders

我還沒有能夠嘗試任何事情，因爲我甚至沒有線索從哪裏開始。即時通訊不是在jquery begginer，但woudlnmt知道該怎麼做 – saunders

對於彈出效果，您真的需要爲4種不同的樣式設置動畫效果，具體取決於您的CSS偏好設置，您可以設置頂部和左側的動畫效果，或者如果您使用邊距（爲什麼？）margin-top和margin-left，你將「泡沫」向外擴展中心的效果，而不是從左上角到右下角。

這是頂部的jQuery的例子/左

var newHeight = 300; 
var newWidth = 300; 

jQuery('#element').animate({ 
    "top":newHeight/2, 
    "left":newWidth/2, 
    "height":newHeight, 
    "width":newWidth, 
    "opacity":1 
}, 'fast', easeInOutCirc);

您可以找到緩和作用在這裏：http://gsgd.co.uk/sandbox/jquery/easing/

其值得一提的，你應該更具體一點與您的問題，我們'不介意讀者:)

來源

2011-09-14 14:20:14

感謝回覆的傢伙。在這個網站[這裏] [1]有一個泡沫效應，但它只是從左向右增長。我想從中心向外發展，我希望我可以找到一個例子來展示，但我沒有什麼可以展示，因爲我什麼也沒有顯示任何例子。我所有的是一個帶圓圈的div bg圖像 [1]：http://1minus1.com/develop – saunders

這正是上面的例子應該做的，你的元素應該被絕對定位，你應該準備好搖滾！ –

啊好的。很酷感謝您的幫助。我明天早上試試這個試試。並讓你知道 – saunders

jQuery show() function

jQuery animate

這些應該給你一個想法。你也可以考慮使用圖像來說明你想要達到的目標。

我建議構建你需要的內容，然後詢問人們如何改變它以得到你想要的結果。這對於人們來說會更容易回答。

來源

2011-09-14 14:13:05 daveyfaherty

這是一個簡化版本的this fiddle我在那裏做了一件非常類似於你正在做的事情。希望能幫助到你。

function(){ 
    var position = $('#bubbleposition'), 
     bubble = $('#bubble'), 
     startRadius = 200, 
     newRadius = 400, 
     startleft = 10, 
     starttop = 10, 
     endleft = 50, 
     endtop = 50; 
    position.css({left: startleft, top: starttop, 10)}); 
    bubble.css({height: startRadius, width: startRadius}); 
    position.animate({left: endleft, top: endtop}); 
    bubble.animate({height: newRadius, width: newRadius}, 400); 
} 

<div id='bubbleposition'> 
    <div id='bubble'> 
     Hello! 
    </div> 
</div>

來源

2011-09-14 14:21:40 dtanders

創建一個div，它會像泡沫一樣增長

回答

相關問題