Threaded View

  1. #1
    Sencha User tomalex0's Avatar
    Join Date
    Apr 2009
    Location
    San Jose, CA
    Posts
    589
    Vote Rating
    16
    tomalex0 will become famous soon enough

      0  

    Default On/Off toggle buttom

    On/Off toggle buttom


    Hi,

    A small tweak in css gave me usual Toggle Button that we used to see in Iphone

    Example
    Code:
    {
                            xtype: 'toggle',
                            name: 'single_toggle',
                            value : 1
                        }
    Css

    Code:
    .x-field-toggle .x-slider {
        -webkit-border-radius: 0em;
        -webkit-box-shadow: inset rgba(0, 0, 0, 0) 0 0 0;
      }
      
      
      .x-field-toggle .x-slider .x-field-thumb:after {
        position: absolute;
        width: 2.5em;
        height: 2.5em;
        top: 0;
        left: 0;
        -webkit-box-shadow: rgba(0, 0, 0, 0) 0 0 0em;
        -webkit-border-radius: 0em;
        -webkit-transform: scale(0);
        border: none;
        background:none;
        overflow: visible;
        z-index: 2;
      }
      
      .x-field-toggle .x-slider.x-toggle-on {
        -webkit-appearance: none;
        background: url(checkbox_on.png);
        width: 94px;
        height: 27px;
        border: 0;
        float: left;
        margin: 8px 4px 0 5px;
      }
        
      .x-field-toggle .x-slider.x-toggle-off {
        -webkit-appearance: none;
        background: url(checkbox_off.png);
        width: 94px;
        height: 27px;
        border: 0;
        float: left;
        margin: 8px 4px 0 5px;
      }
    Attached Images

Similar Threads

  1. Autoload Refresh when Click the Buttom
    By footballermahesh in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 8 Oct 2009, 7:28 PM
  2. (SOLVED) scroll dataview automatically to the buttom
    By robin30 in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 21 Feb 2009, 3:06 PM
  3. in layout column to put button to buttom
    By emredagli in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 6 Aug 2008, 2:35 AM
  4. add tab from a link or a buttom
    By simpaulguy in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 29 Dec 2006, 11:37 AM

Thread Participants: 14