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 3 of 3
  1. #1
    New Coder
    Join Date
    Aug 2011
    Location
    Mauritius
    Posts
    25
    Thanks
    2
    Thanked 0 Times in 0 Posts

    How can make toggleClass method takes dynamic id ?

    Hi all, I have written this jquery below:

    $(document).ready(function() {
    $('area').click(function(e){
    var content_id = $(this).attr('id').replace('area_', 'content_');
    $('.content').each(function(){
    if ($(this).attr('id') == content_id)
    $(this).fadeToggle();
    else
    $(this).css('display', 'none');
    });
    $('body').each(function(){
    var color_id = $(this).attr('id').replace('area_', '.');
    $(this).toggleClass(color_id);
    });
    });


    });


    Essentially for the first part of it i just toggle a div with class content when click on an image with image map - by using id's - for the seconf part I want to also change the background of the body by adding a class.

    So I;m trying to create a var color_id to generate the correspondint class.

    For eg the id of the area map is area_blue and the piece of code converts it to .blue - then i want to use this in the toggleClass method - but this is not working.

    Any clue please.

    //Sam

  • #2
    New Coder
    Join Date
    Aug 2011
    Location
    Mauritius
    Posts
    25
    Thanks
    2
    Thanked 0 Times in 0 Posts
    anyone?

  • #3
    New Coder
    Join Date
    Aug 2011
    Location
    Mauritius
    Posts
    25
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Updated code:
    <script>
    $(document).ready(function() {
    $('area').click(function(e){
    var content_id = $(this).attr('id').replace('area_', 'content_');
    var color_id = $(this).attr('id').replace('area_', '');
    $('.content').each(function(){
    if ($(this).attr('id') == content_id) {
    $(this).fadeToggle();
    $('body').toggleClass(color_id);
    }
    else {
    $(this).css('display', 'none');

    }
    });






    });


    });
    </script>


    Now i can toggle the class but how can i remove the added class before toggling another one ??


  •  

    Posting Permissions

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