jQuery UI/Effects/effect kullanımı

Merhabalar bi başka makale ile birlikte sizlerleyim. Bu yazımda sizlere UI/Effects/efeect kullanımı hakkında biraz bilgi vereceğim. jQuery UI effect ile belirttiğimiz Id'ye bağlı nesnenin gösterimi UI efektleri ile gösterebiliriz. Öreği ve demosu için buraya bakabilirsiniz.
<html>
<head>
  <link href="libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
  <script src="libs/jquery/1.4/jquery.min.js"></script>
  <script src="libs/jqueryui/1.8/jquery-ui.min.js"></script>
  <script src="latest/ui/effects.core.js"></script>
<script src="latest/ui/effects.explode.js"></script>
<style type="text/css">
  div { margin: 0 auto; width: 100px; height: 80px; 
background: blue; position: relative; }
</style>
  <script>
  $(document).ready(function() {
    $("#tiklanacak").click(function () {
      $("#div_id").effect("slide");
    });
  });
  </script>
</head>
<body style="font-size:62.5%;">
 
<span id="tiklanacak">BURAYA TIKLA</p>
 
<div id="div_id"></div>
 
</body>
</html>
Yukarıdaki kod parçasında $("#tiklanacak").click(function () kısmında: #tiklanacak ID'li nesneye tıklandığında $("#div_id").effect("slide"); #div_id ID'li nesneyi slide effect'i ile göster diyoruz. Ayrıca "slide" yerine aşağıdaki efektleri kullanabilirsiniz.
'blind', 'bounce', 'clip', 'drop', 'explode', 'fold', 'highlight', 'puff', 'pulsate', 'scale', 'shake', 'size', 'slide', 'transfer'
Konu hakkında ayrıntılı bilgi ve soru cevap için coderler jQuery UI/Effects/effect kullanımı forumunu ziyaret edin.

Hiç yorum yok:

Yorum Gönder