topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

talk show tell print

lib-jquery-learning-code-10-ui.css / css
=effects *************************************

  
  
  #mydiv, #explode, #toggle-class {
    height: 100px;
    width: 100px;
    line-height: 100px;
    text-align: center;
    border: 1px solid #999;  
  }
  
  #mydiv, #toggle-class {
    color: #000;
    background-color: #fff;
  }
  #explode {
    color: #fff;
    background-color: #3a3;  
  }
  .ui {
    float: left;
    width: 110px;
  }
  #container .highlight {
    background-color: #f00;
  }
=sortables *************************************

  
  #sortables {
    padding-top: 2em;
    clear: left;
  }
  #sort-container {
    list-style-type: none;
    margin: .5em;
    padding: 0;
  }
  #sort-container li {
    background-color: #ddd;
    border: 1px solid #999;
    padding: 10px;
    width: 350px;
    margin: .5em;
  }
  
  #sort-container .ui-sortable-helper {
    background-color: #3a3;
  }
=dialog *************************************

  
  #dlg {
    padding: 1em;
  }
  
  /*
  * jQuery UI CSS Framework
  * Copyright (c) 2008 AUTHORS.txt (http://ui.jquery.com/about)
  * Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
  */
  
  /* Layout helpers
  ----------------------------------*/
  .ui-helper-hidden { display: none; }
  .ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
  .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
  .ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  .ui-helper-clearfix { display: inline-block; }
  /* required comment for clearfix to work in Opera \*/
  * html .ui-helper-clearfix { height:1%; }
  .ui-helper-clearfix { display:block; }
  /* end clearfix */
  .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
  
  /* Interaction Cues
  ----------------------------------*/
  .ui-state-disabled { cursor: default !important; }
  
  /* Icons
  ----------------------------------*/
  
  /* states and images */
  .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
  
  /* Misc visuals
  ----------------------------------*/
  
  /* Overlays */
  .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
  
  /* Dialog
  ----------------------------------*/
  .ui-dialog { position: relative; padding: .2em; width: 300px; }
  .ui-dialog-titlebar { padding: .5em .3em .3em 1em; position: relative;  }
  .ui-dialog-title { float: left; margin: .1em 0 .2em; } 
  .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
  .ui-dialog-titlebar-close span { display: block; margin: 1px; }
  .ui-dialog-titlebar-close:hover, .ui-dialog-titlebar-close:focus { padding: 0; }
  .ui-dialog-content { border: 0; padding: .5em 1em; background: none; overflow: auto; }
  .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
  .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; padding: .2em .6em .3em .6em; line-height: 1.4em; width:auto; overflow:visible; }
  .ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
  .ui-draggable .ui-dialog-titlebar { cursor: move; }
  
  /* Resizable
  ----------------------------------*/
  .ui-resizable { position: relative;}
  .ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;}
  .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
  .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0px; }
  .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0px; }
  .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0px; height: 100%; }
  .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0px; height: 100%; }
  .ui-resizable-se { cursor: se-resize; width: 7px; height: 7px; right: -5px; bottom: -5px; }
  .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }
  .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }
  .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.