Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript not working in liquid css button

    I am redesigning a web application . I want to introduce color themes in it. When i click on a particular theme i want a new look to appear including buttons. For this i m using the below css code which uses only 3 button images(single image sliced in 3)wherin only the background color is to be changed thru css and new button gets created.



    body {
    margin: 0;
    padding: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    }
    .btn {
    float: left;
    clear: both;
    background: url(images/btn_left.png) no-repeat;
    padding: 0 0 0 10px;
    margin: 5px 0;
    }
    .btn a{
    float: left;
    height: 40px;
    background: url(images/btn_stretch.png) repeat-x left top;
    line-height: 40px;
    padding: 0 10px;
    color: #fff;
    font-size: 1em;
    text-decoration: none;
    }
    .btn span {
    background: url(images/btn_right.png) no-repeat;
    float: left;
    width: 10px;
    height: 40px;
    }
    .btn_addtocart { background-color: green; }


    HTML code:

    <div class="btn btn_addtocart"><a href="#>Submit</a><span></span></div>
    <div class="clear"></div>
    Background Color: Red


    The earlier web application used:

    <input type="image" onclick="javascript:return validate()>
    wherin the validate function includes
    function validate()
    {
    var user = document.login.loginid.value;
    var pwd = document.login.loginid.value;

    if(document.login.loginid.value.length==0)
    {
    alert("Enter user name");
    return false;
    }
    if(document.login.password.value.length==0)
    {
    alert("Enter password");
    document.login.password.focus();
    return false;
    }
    return true;
    }

    I cannot use javascript:return validate() with this new html code
    i.e.
    <div class="btn btn_addtocart">
    <a href="#>Submit</a><span></span></div>
    <div class="clear"></div>
    Background Color: Red

    Please provide me with a new javascript code to run the above css code or similar css code to run this javascript.
    Last edited by arc_85; 10-22-2010 at 09:45 AM.

  • #2
    Banned
    Join Date
    Oct 2010
    Posts
    115
    Thanks
    30
    Thanked 0 Times in 0 Posts
    I dont really know how to help you but I would love to see what this looks like when its done

    I would check it through w3c validator though just to see if youre missing any end tags or something


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •