Jump to content
php.lv forumi
  • 0

JQuery expand divu vertikāli/horizontāli


Valcha
 Share

Question

Sveiki! Meklēju veidu, kā ar JQuery ērti izvērst no centra punkta uz visām pusēm divu. Līdzīgi, kā kādreiz ieslēdzās teļuki - tur gan bija tikai vertikālā izvēršanās novērojama, bet interesē visos virzienos no 1 punkta.

Nav kāds redzējis gatavu pluginu, vai pieeju, kā to darīt? Negribas izmantot kaut kādu mega pluginu tipa Thickbox priekš tāda nosacīta nieka.

 

SlideUp funkcijas mīnuss ir tāds, ka viņa izrullē no augšējās rindas uz leju. Bet mani interesē, lai tas notiktu no centra punkta. Un tieši tas pats pretējā virzienā...

 

Negribas pašam izgudrot riteni, ja kāds kaut kur jau ar tādu braukā :)

 

P.S. Tāpat izvairos no UI, jo tā bibliotēka ir ļooti liela.

Edited by Valcha
Link to comment
Share on other sites

2 answers to this question

Recommended Posts

  • 0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<style>
.k1{
  border:1px solid #888;
  background:#eef;
  position:absolute;
  width:0px;
  height:0px;
  left:50%;
  top:50%;
  overflow:hidden;
}
</style>
<script>
$(function(){
 $('<div class="k1"></div>')
   .appendTo('body')
   .animate({left:'20%',top:'20%',width:'60%',height:'60%'},5000)
   .animate({left:'50%',top:'50%',width:'0%',height:'0%'},5000);
});
</script>
</head>
<body>

</body>
</html>

Edited by codez
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...