jQuery UI Demo

jQuery UI 의 기본적인 사용법입니다.

RSUPPORT

RSUPPORT

Here~

  1. RemoteCall
  2. RemoteCall + mobile pack
  3. RemoteCall appliance
  4. RemoteView
  5. RemoteKVM
  6. RemoteAPI
  7. Mobizen
  • RemoteCall
  • RemoteCall + mobile pack
  • RemoteCall appliance
  • RemoteView
  • RemoteKVM
  • RemoteAPI
  • Mobizen
HTML
			

				
RSUPPORT
CSS
			#draggable { width: 150px; height: 150px; padding: 0.5em; }
Javascript
		/** =======================================================
		 * RFC jQueryUI Demo
		 * 
		 * @Author Choi Jae Hee
		 * @Copyright © 2012 RSUPPORT. CO, LTD. All rights Reserved.
		 * 
		 * @Required jQuery
		 * ======================================================== */
		
		;(function($){
		  $('#draggable').draggable();
		})(jQuery);
HTML
			

			  
RSUPPORT

			
				 
			

			  
Here~
CSS
			#dragdrop { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
			#droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
Javascript
		/** =======================================================
		 * RFC jQueryUI Demo
		 * 
		 * @Author Choi Jae Hee
		 * @Copyright © 2012 RSUPPORT. CO, LTD. All rights Reserved.
		 * 
		 * @Required jQuery
		 * ======================================================== */
		
		;(function($){
			$('#dragdrop').draggable();
			$('#droppable').droppable({
				drop: function(event, ui) {
					$(this).addClass('ui-state-highlight').find('p').html('Gooooooooooal!');
				}
			});
		})(jQuery);
HTML
			
    
			  
  1. RemoteCall
    2. 
			  
  2. RemoteCall + mobile pack
    3. 
			  
  3. RemoteCall appliance
    4. 
			  
  4. RemoteView
    5. 
			  
  5. RemoteKVM
    6. 
			  
  6. RemoteAPI
    7. 
			  
  7. Mobizen
    8.
CSS
	    #feedback { font-size: 1.4em; }
	    #selectable .ui-selecting { background: #FECA40; }
	    #selectable .ui-selected { background: #F39814; color: white; }
	    #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
	    #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px;  color: #ad0021; }
Javascript
		/** =======================================================
		 * RFC jQueryUI Demo
		 * 
		 * @Author Choi Jae Hee
		 * @Copyright © 2012 RSUPPORT. CO, LTD. All rights Reserved.
		 * 
		 * @Required jQuery
		 * ======================================================== */
		
		;(function($){
		  $('#selectable').selectable();
		})(jQuery);
HTML
			
    
			  
  • RemoteCall
    • 
			  
  • RemoteCall + mobile pack
    • 
			  
  • RemoteCall appliance
    • 
			  
  • RemoteView
    • 
			  
  • RemoteKVM
    • 
			  
  • RemoteAPI
    • 
			  
  • Mobizen
    •
CSS
			#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
			#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; color: #ad0021; }
			#sortable li span { position: absolute; margin-left: -1.3em; }
Javascript
		/** =======================================================
		 * RFC jQueryUI Demo
		 * 
		 * @Author Choi Jae Hee
		 * @Copyright © 2012 RSUPPORT. CO, LTD. All rights Reserved.
		 * 
		 * @Required jQuery
		 * ======================================================== */
		
		;(function($){
			$('#sortable').sortable();
			$('#sortable').disableSelection();
		})(jQuery);
History