CODEWITHSUNDEEP
jqueryaddclass
Matthew Scott
Matthew Scott

Reputation: 1

Jquery addClass not working (yes I've looked at lots of previous q and a and no joy

I originally just wanted to add the fade function but that didn't work so I resorted to this. I have had no joy with any selector on any element in any of the page and I'm flumoxed. I am using other jquery libraries and wonder if there is a conflict there, but in anther site, I use all the same jquery libraries - cycle, easing etc and no conflicts.

Here's the code:

<script type="text/javascript">
$('.boda').click(function()
{

$('.fili1').addClass('appear');
});
</script>

<body onload="DrawCaptcha();">
<div id="top-bg">
    <div class="navcontainer">
        <div class="logo"><img src="graphics/logo.png" alt="logo" width="250" height="100"></div>
        <div class="fili1"><img src="graphics/filigree2.png" alt="filigree" width="90" height="120" /></div>
        <div id="nav">
            <ul>
                <li><a href="#" title="comenzar" onClick="colorFade('top-bg','background','','999999')">HOME</a></li>

                <li><a href="#" title="nuestra oferta" onClick="colorFade('top-bg','background','','999999')">SERVICIOS</a></li>

                <li><span><a href="#" class="boda" title="el dia de tu vida" onClick="colorFade('top-bg','background','999999','ffffff')">Bodas</a></span></li>

                <li><a href="#" title="envia un mensaje" onClick="colorFade('top-bg','background','','999999')">CONTACTO</a></li>
            </ul>
        </div>
    </div>
</div>

css:

.fili1 {
background-color: none;
position:absolute;
top:10px;
right:10px;
opacity:0;
}

.appear {
opacity1;}

Upvotes: 0

Views: 266

Answers (6)

Kanishka Panamaldeniya
Kanishka Panamaldeniya

Reputation: 17586

try this

<script type="text/javascript">

$(document).ready(function(){

    $('.boda').click(function()
    {

        $('.fili1').addClass('appear');
        return false;
    });

});
</script>

and also

.appear {
   opacity:1;
}

Upvotes: 0

Roko C. Buljan
Roko C. Buljan

Reputation: 206699

.appear {opacity1;}

change into:

.appear {
   opacity:1;
}

BUT... You can do it just using .toggle() like:

$('.boda').click(function(e){
  $('.fili1').toggle();
  return false;
});

demo

Upvotes: 1

Paul
Paul

Reputation: 9022

Fifth line in your code example should read

$('.fili1').addClass('appear');

Note the dot in front of class name. Also it should be opacity:1; (note the :).

Here's a working example: http://jsfiddle.net/xZ6Kr/

Upvotes: 0

codecandies
codecandies

Reputation: 279

Really? Look a the dot:

$('.fili1').addClass('appear'); // instead of $('fili1').addClass('appear');

Good luck.

Upvotes: 0

Sagiv Ofek
Sagiv Ofek

Reputation: 25280

your selector is wrong. please read about selectors.

$('fili1').addClass('appear');

should be

$('.fili1').addClass('appear');

Upvotes: 0

pollirrata
pollirrata

Reputation: 5286

If that's your code, the .appear class is wrong should be opacity: 1;

Upvotes: 0

Related Questions