CODEWITHSUNDEEP
jqueryhtmlcss
DisEngaged
DisEngaged

Reputation: 219

HTML and JS, changing input type


How do I change the input type? I want to use a class or id from CSS, without breaking my script.

My input type is 'button' which puts a generic looking button on the page. I want to use #myStyle instead. Please help.
Thanks,

<!DOCTYPE html PUBLIC "">
<head>
<style>
#mySprite{
    background:url('image.gif') 0 -480px;
    left:0px;
    width:13px;
    }
</style>
<script type="text/javascript" src="js/jquery-1.4.min.js"></script>
<script type='text/javascript'>
    var fontSizes = [14, 16]
    $(function(){
      $('#PlusMinus').click(function() {
            if($(this).val() == "+") {
            $('#OurText').css('fontSize', fontSizes[1] + 'px');
            $(this).val("-");
        }
        else {
            $('#OurText').css('fontSize', fontSizes[0]+ 'px');
            $(this).val("+");
        }
           $("body .h6").toggle();
        });
    });
</script>
</head>
<body>
    <h6 class="noSpan">
    <!--MY INPUT TYPE NEED TO BE CSS STYLE-->
        <input type='button' class="cat" value='+' id='PlusMinus' />
        <span class="h6">Larger</span>
        <span class="h6" style="display: none">Smaller</span>
    </h6>
    <h5 id="OurText" class="p">TEXT</h5>
</body>
</html>

Upvotes: 0

Views: 104

Answers (1)

wsanville
wsanville

Reputation: 37516

If you want your styles to get applied, either change the id on the element to read the following:

<input type='button' class="cat" value='+' id='mySprite' />

Or, you can change your CSS rule to:

#PlusMinus
{
    background:url('image.gif') 0 -480px;
    left:0px;
    width:13px;
}

Upvotes: 1

Related Questions