It looks like clicking the (submit) button is also submitting the
form, which loads the same page again with the default text size.
Add a "return false" to prevent the form from submitting.
$('#small').click(function() {
$("#textsize").addClass("smalltext");
return false;
});
On Aug 18, 3:40 pm, AMP <[email protected]> wrote:
> Its pretty simple, I've included all the code here:
> *****************************************************
> A.html
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <html xmlns="http://www.w3.org/1999/xhtml">
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
> <title>Untitled Document</title>
> <link href="A.css" rel="stylesheet" type="text/css" />
> <script type="text/javascript" src="../Jquery/jquery-1.3.2.js"></
> script>
> <script type="text/javascript" src="A.js"></script>
> </head>
> <body><form action="" method="get" target="_self">
> <p>
> <label>
> <input type="submit" name="small" id="small" value="small" />
> </label>
> <label>
> <input type="submit" name="large" id="large" value="large" />
> </label>
> </p>
> </form>
> <p id="textsize">Hello World</p>
> </body>
> </html>
> ********************************************************************
> A.css
>
> @charset "utf-8";
> /* CSS Document */
>
> .smalltext{font-size:9px;}
> .largetext{font-size:36px;}
>
> **************************************************************
> and A.js is the original code I posted
>
> Thanks
>
> On Aug 18, 9:15 pm, Charlie <[email protected]> wrote:
>
> > this looks fine, must be something else css or script related. Perhaps you
> > could create a test page at jsbin.com, it has an option to include jquery
> > and therefore present live issues
> > AMP wrote:Hello, When I click on the either button, the size changes
> > correctly, but goes right back to the default. What am I doing wrong?
> > $(document).ready(function() { $('#small').click( function() {
> > $("#textsize").addClass("smalltext") }); $('#large').click( function() {
> > $("#textsize").addClass("largetext") }); }); Thanks
>
>