DojoReveal – iletişim kutusu uygulaması

By

DojoReveal

Jonathan Smiley  tarafından jQuery için hazırlanmış olan Dojo Reveal Plugin. Bu eklenti  sayesinde popup  açılmasını  istediğiniz  nesnelere  fade ve  yukardan inen animasyon etkisi  kullanarak görsellik verebilir  yada bu etkiler  olmadan facebook benzeri pop-up  açılma  pencereleri  oluşturabilirsiniz. Pop-up  pencere açıldığı  an sayfada  biraz  kararma oluşuyor birinci demoda. İkinci  demoda ise pop-up  dışında kalan bölümler  kapkaranlık bir hal  alıyor.

 

 

Kullanım

  • Head etiketleri arasına eklenecek olan bölümler.

Js dosya adresleri

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript" src="jquery.reveal.js"></script>

Css :
<style type="text/css">
body { font-family: "HelveticaNeue","Helvetica-Neue", "Helvetica", "Arial", sans-serif; }
.big-link { display:block; margin-top: 100px; text-align: center; font-size: 70px; color: #06f; }
</style>

  • Body  etiketleri  arasına eklenecek olan kısım.

Html :

<a href="#" class="big-link" data-reveal-id="myModal">
			Fade and Pop
</a>	
<a href="#" class="big-link" data-reveal-id="myModal" data-animation="fade">
			Fade
</a>
<a href="#" class="big-link" data-reveal-id="myModal" data-animation="none">
			None
</a>
<div id="myModal" class="reveal-modal">
			<h1>Reveal Modal Goodness</h1>
			<p>This is a default modal in all its glory, but any of the styles here can easily be changed in the CSS.</p>
			<a class="close-reveal-modal">×</a>
</div>

 



Leave a Comment

Your email address will not be published.

You may also like

Trend