1
ஜெகொரி UI இண்டெர் ஆக்சன்ஸ்



ஜெகொரி UI அம்சங்கள்:
  • இண்டர் ஆக்டிவ் வெப் பயன்பாடுகளை உருவாக்க பயன்படுகின்றது.
  • இது ஓபென் சோர்ஸ் சாஃப்ட்வேர் மற்றும் இலவசமாகும்.
  • நிலையானது
  • நிர்வாகிக்க எளிது.
  • எல்லா பிரவுசராலும் ஆதரிக்கப்படுகின்றது.
  • டாக்குமென்டேசன் நன்றாக உள்ளது

jQuery UI வகைகள்.

இது நான்கு வகைப்படும்.
1.      இன்டெர் ஆக்சன்ஸ்
2.      விட்ஜெட்ஸ்
3.      எஃபெக்ட்ஸ்
4.      உடிலிடிஸ்
இதில் இந்த கட்டுரையில் இன்டெர் ஆக்சன்ஸ் பற்றி காண இருக்கின்றோம். இது DOM எலெமென்ட்ஸ் உடன் இன்டெராக்ட் செய்ய பயன்படுகின்றது.
 அதன் வகைகள்

1.      .டிராக்கபிள்
2.      டிராப்பபிள்
3.      ரிசைஸபிள்.
4.      செலெக்டபிள்.
5.      சார்ட்டபிள்.
டிராக்கபிள்.
ஜெகொரி டிராக்கபிள் மெத்தட் ஆனது. ஒரு எலெமெண்ட் ஜெகொரி  மூலம் டிராக்கபிள் ஆன பிறகு அதை அந்த பக்கதிற்குள் எங்கு வேண்டுமானாலும் டிராக் செய்யலாம்.
சான்று நிரல்

 

<!DOCTYPE html>  
<head>  
  <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">  
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>  
  <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>  
  <style>  
  #draggable { width: 100px; height: 100px; padding: 0.5em; background:#7fffd4;}  
  </style>  
  <script>  
  $(function() {  
    $( "#draggable" ).draggable();  
  });  
  </script>  
</head>  
<body>  
     <div id="draggable" class="ui-widget-content">  
      <p>I am draggable!</p>  
     </div>  
</body>  
</html>  

jQuery UI Droppable

இந்த வசதியானது நீங்கள் DOM எலெமென்டை  எங்கு வேண்டுமானாலும் டிராக் செய்து டிராப் செய்ய உதவுகின்றது.

 

<!doctype html>  
<html lang="en">  
   <head>  
      <meta charset="utf-8">  
      <title>jQuery UI Droppable - Default functionality</title>  
      <link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">  
      <script src="http://code.jquery.com/jquery-1.10.2.js"></script>  
      <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>  
      <style>  

Leave a comment