SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict
    Join Date
    Mar 2004
    Posts
    260
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing background color with jQuery tools

    I'm using this set-up: http://flowplayer.org/tools/demos/tabs/slideshow.htm

    Works ok (with a bit more CSS to do):
    http://stage.truedesign.electra-2.ti...true/logos.php

    However, what I now need is for the background color to change with each tab change. There is a bit of explanation on jQuery events here: http://flowplayer.org/tools/document...ng.html#events But to be honest it doesn't mean much to me.

    I've added data-bgcolor="#FF0000" to each of the image layers, and then tried adding this script
    Code:
    	 onClick: function(event,tabIndex){
         var bg = $(event.element).data('bgcolor');
         $('body').css('background-color', bg);
    	 }
    Doesn't work: http://stage.truedesign.electra-2.ti...rue/logos1.php

    I would be grateful for any help, because I'm not fluent with JS at all, although I'm quite ok with HTML/CSS

    Many thanks.

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,526
    Mentioned
    83 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by spirelli View Post
    However, what I now need is for the background color to change with each tab change.
    The standard way of doing that is to remove a class name of "selected" from all the tabs, and then to add "selected" to the one that is currently selected.
    That way you can use CSS to style the selected tab in the manner that it shoudl be styled, which helps to keep the presentational aspect of things right where it belongs.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Addict
    Join Date
    Mar 2004
    Posts
    260
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the reply. Sorry if that wasn't clear, but
    I'm not looking to change the style of each tab,
    but the background color of the whole page, i.e. BODY tag.

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,526
    Mentioned
    83 Post(s)
    Tagged
    4 Thread(s)
    I don't think that an event object has a property called element.
    Try using event.target instead.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

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