how to improve the margin-left in Touch-Enabled-Skinnable-Toggle-Switches-with-jQuery-asSwitch ?

Question

0.00/5 (No votes)

See more:

, +

Hi i am working on the Touch Enabled Skinnable Toggle Switches with Jquery Plugin but i do not understand how to assign the margin-left into the div...

This is my html code,

HTML

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>        
        <title>jQuery asSwitch Plugin Demos</title>
        <link rel="stylesheet" href="css/asSwitch.css">
        
        <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>     
        

        <script src="js/jquery-asSwitch.js"></script>        

    </head>
<body>
<div id="wrapper" style="margin-left:100px;">
    
        <h2>jQuery asSwitch Plugin Demos</h2>        

        <section>          
            
            <div class="example">
                <input class="sw-8" type="checkbox" checked="checked" />
                <script>                   
                    $(document).ready(function() {
                        $('.sw-8').asSwitch({
                            skin: 'skin-8'
                        });  
                    });
                </script>
            </div>         
           
        </section> 
</div>
</body>
</html>

and when i see ,

HTML

<div class="asSwitch-inner-box" style="margin-left: -42px;">
<div class="asSwitch-on">LIVE</div>
<div class="asSwitch-off">HIDDEN</div>
</div>
</div>

and i use asSwitch.css, jquery-asSwitch.js and jquery, then i don't understand how assign -42px margin-left to the <div class="asSwitch-inner-box"> please give me a way to find solution for my problem.

[Edit member="Tadit"]
Added pre tags.
[/Edit]

Posted 6-Jan-15 21:05pm

AnUpAm 786

Updated 6-Jan-15 21:33pm

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

v3

Add a Solution

Comments

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) 7-Jan-15 3:34am

You have already assigned the margin-left. Is not that working?

AnUpAm 786 8-Jan-15 0:26am

margin-left works very well but i do not understand how i can change this margin-left's value... suppose i want margin-left:-65px; is it possible without changing in asSwitch.js file?

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) 8-Jan-15 2:49am

See my answer.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) · Accepted Answer · 2015-01-07T20:48:00

Solution 1

Just write this class again in your HTML file like..

HTML

<style>
    .asSwitch-inner-box
    {
        margin-left: -65px;
    }
</style>

Posted 7-Jan-15 20:48pm

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)