Home / Forums / ePix Support / Button on fullScreen Slider

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts

  • Jorge Arroyave
    Participant

    hi.

    I have a question about the button of skin changer on your demo page (epix.themeva.com), can and/or how I configure a similar button in my website with other features, not the skin changer?, is it possible? (e.g. facebook posts)

    best regards

    Andy
    Andy
    Keymaster

    Hi Jorge,

    It’s all jQuery based. I can give you the code I used and you can use that, however I can’t support anything you create unless you’re using the Customization forum .

    The following code goes into Appearance > Theme Options > Customize > Javascript:

    <script type="text/javascript">
    jQuery(document).ready(function() {
    
    jQuery('#primary-wrapper').prepend('<span class="settings-wrap text_linkcolor skinset-main nv-skin"><i class="fa fa-cog fa-2x"></i></span><div class="skin-changer skinset-main nv-skin"> *** YOUR CONTENT GOES HERE *** </div>');
    
    jQuery('span.settings-wrap').click( function() {
     if( jQuery(this).hasClass('active') ) {
     jQuery('div.skin-changer').animate({'right':'-300px'},'slow');
     jQuery(this).removeClass('active')
    } else {
     jQuery('div.skin-changer').animate({'right':'-10px'},'slow');
     jQuery(this).addClass('active')
    } 
    
    });
    
    });
    
    jQuery(window).load(function() {
    jQuery('div.skin-changer').delay(2000).animate({'right':'-300px'},'slow');
    });
    
    </script>

    The following code goes into Appearance > Theme Options > Customize > Custom CSS:

    div.skin-changer {
    position:fixed;
    top:100px;
    right:-10px;
    margin-top:40px;
    z-index:1000;
    padding:5px 15px 5px 5px;
     -moz-border-radius: 10px; 
     -webkit-border-radius: 10px;
     border-radius: 10px;
     width:180px;
     text-align:center;
    }
    
    span.settings-wrap,
    div.skin-changer {
    -moz-box-shadow: 0 0 5px rgba(0,0,0,0.1);
     -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.1);
     box-shadow: 0 0 5px rgba(0,0,0,0.1); 
    }
    
    span.settings-wrap {
     height:40px;
     width:40px;
     position:fixed;
     -moz-border-radius: 100%; 
     -webkit-border-radius: 100%;
     border-radius: 100%;
     padding:0;
     right:25px;
     top:100px;
     margin-top:-20px;
     text-align:center;
     display:block;
     z-index:1000;
    cursor:pointer;
    }
    
    span.settings-wrap i {
    line-height:40px;
    }
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.