[jQuery] "Zatrzymanie" DIV'a

Question

Mam taki problem. Na stornie umieściłem DIV'a o id="omnie" i chce, aby po kliknięciu rozszerzał się do zadanych rozmiarów, a po kliknięciu poza tego DIV'a np w DIV o id="conteiner" wracał do pierwotnych rozmiarów.  Stworzyłem taki kod:

$(function(){
	var o = $("div#omnie");
	var l = $(".icon-user");
	var b = $("#container");
	
		o.on({
			click: function(){
				o.empty().animate({
						height: '600px',
			            width: '950px'	
					}).css({
							"background-color" : "#ffffff",
							"color" : "black",
							"text-align" : "justify"
					});
			}	
		});	

	         b.on({
			click: function(){
				o.animate({
					width: "470px",
					height: "250px"
				});
			}
		})
		});

I owszem na kliknięcie DIV rozszerza się do zadanych rozmiarów, ale później automatycznie, od razu zmniejsza się do pierwotnych rozmiarów, a powinien zmniejszyć się dopiero po kliknięciu poza jego obszar. Zna ktoś sposób aby:

a) po kliknięciu na DIV id="omnie" DIV rozszerzał się do zadanej wielkości i tak pozostał, aż

b) po kliknięciu poza DIV id="omnie" np. w DIV id="container" zamykał się?

Answer 1

Chodzi o taki efekt?

http://jsbin.com/hopoqeferu/1/edit?html,css,js,output

Comments

dokładnie o to chodziło! dzięki!

---

a gdybym w Twoim przykładnie tekst "O mnie" chciał zastąpić innym dowolnym tekstem, a po kliknięciu miałby on wraz z powrotem do pierwotnch rozmiarów przywracać wcześniejszy tekst. Jak można siągnąć taki efekt?

---

http://jsbin.com/jazekomalo/1/edit?html,css,js,output