Rss Feed
Tweeter button
Facebook button
Technorati button
Reddit button
Myspace button
Linkedin button
Delicious button
Digg button
preload preload preload preload

jQuery drag drop uygulaması 1

Bu uygulama ile açılır kapanır bir bölüm yapacagız örnegin sitemiz bir kitap sitesi ve arama yapıldıgında kitap yazarı, yayın evi ve kitap adı sonuçları sorgulanıp ekranımıza dökülüyor. Bu verilerin hepsi aynı anda ekrana dökmektense 3 bölüme ayırıp her birinin üzerinde yer alan ana başlıga tıkladığımızda gizlenmesini ve geri tıklandıgında açılması sağlamak kullanıcılar açısından kullanım kolaylıgı sağlar. Bu örnegimizde başlık vebaşlıgın altındaki kısımların yer aldıgı bir uyuglama görecegiz ayrıca uygulamayı ekrandan kaldırma yani kapatma özelliğimizde yer alıyor.

Dosyamızın adı index.html olsun,index dosyamızın kodları aşagıdaki şekildedir. Diğer jquery dosyaları ekte yer almaktadır.

Uygulama Dosyaları ‘nı indir…

Uygulama çalışır halini incelemek için tıklayın

index.html

	
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<title>serpito.com || Müslüm Gümüşlüoğlu Drop Örneği</title>
	
<link href="inettuts.css" rel="stylesheet" type="text/css" />
</head>
<body>
	
<div id="columns" >
<ul id="column2" class="column">
<li class="widget color-blue">
<div class="widget-head">
<h3>BAŞLIGIMIZ</h3>
</div>
<div class="widget-content" align="left" >
<p>Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com Serpito.com </p>
</div>
	
</li>
</ul>
</div>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery-ui-personalized-1.6rc2.min.js"></script>
<script type="text/javascript" src="inettuts.js"></script>
</body>
</html>
	
Yazar hakkında
Müslüm Gümüşlüoğlu
Hem yazılım, hem kendini geliştiriyor. teknoloji meraklısı... kişisel weblogu
  • 3 responses to "jQuery drag drop uygulaması 1"

  • Ali
    14:11 on Temmuz 13th, 2009

    sizde ajax a geçmişsiniz :) teşekkürler

  • Netereyon
    10:09 on Temmuz 19th, 2009

    güzel bir paylaşım

  • fitness
    11:27 on Eylül 14th, 2009

    paylasım guzel

  • Leave a Reply

    * Required
    ** Your Email is never shared