ok. replace your js with the following (all the js)
$(function() { // similar to $(document).read() {
var obj = $(".cs_links");
var items = $(".cs_contact", obj);
items.click(function(e) {
e.preventDefault();
var current = items.index($(this));
items.removelass("active");
items.eq(current).addClass("active");
});
});
you can call the above a test.
make sure the active class is being added correctly to the element
then try the rest of your scripts
the error you are getting is because you put te
$(function() {
});
within the
$(document).ready(function(){
});
you cant embed one in the other
you can choose to either use
$(document).ready(function(){
or
$(function() {
On Sun, Jul 5, 2009 at 1:27 PM, Erik R. Peterson <eriks...@mac.com> wrote:
> Still doesn't work.
>
> Page: http://www.enaturalskin.com/needhelp.htm
>
> I placed your script:
>
> var obj = $(".cs_links");
> var items = $(".cs_contact", obj);
> $(".cs_contact").click(function() {
> var current = items.index($(this));
> items.removeClass("active");
> items.eq(current).addClass("active");
> });
> All of my image-based links are inside a <div id="cs_links"></div>. The
> hover works, but no ACTIVE.
>
> Just using two links, is it possible to have ONE active once clicked?
>
> *My CSS:*
>
> #cs_contact {width: 146px; height: 34px; float: left;}
> a.cs_contact {width: 146px; height: 34px; background:
> url('/img/pages/cs_contact.png'); display:block}
> a.cs_contact:hover {background-position: -146px;}
> a.cs_contact_a {width: 146px; height: 34px; background:
> url('/img/pages/cs_contact.png'); display:block;background-position:
> -146px;}
> #cs_appoint {width: 146px; height: 34px; float: left; margin: 10px 0px 0px
> 0px}
> a.cs_appoint {width: 146px; height: 34px; background:
> url('/img/pages/cs_appoint.png'); display:block}
> a.cs_appoint:hover {background-position: -146px;}
>
> *My HTML:*
>
> <div id="cs_links">
> <div id="cs_contact">
> <a class="cs_contact" id="js_contact" href="#"></a></div>
> <div id="cs_appoint">
> <a class="cs_appoint" id="js_appoint" href="#"></a></div>
> </div>
>
> I'm confused on the toggle approach.
>
> Still a novice programmer, but learning fast.
>
> Many thanks for all the help.
>
>
> Erik
>
>
>
>
>
>
>
>
> On Jul 5, 2009, at 4:55 AM, waseem sabjee wrote:
>
> // this is our object refference point. we only want to effect elements
> within this object
> var obj = $(".cs_links");
>
> // we now need a refference point for each item
> // the , obj means we only want items within our object
> var items = $(".cs_contact", obj);
>
> // click function
> $(".cs_contact").click(function() {
> var current = items.index($(this)); // get the .eq() of the item clicked
> // remove the active class from all items
> items.removeClass("active");
> // set clicked item to active
> items.eq(current).addClass("active");
> });
>
>
>
