JS Style Switcher for BG Images 77 Responses

Last post: 2 years ago | Thread started: Jan 28, 10, 9:15 p.m.

RespondNew TopicDisable Images

• BusterBoy

  Can anyone recommend any JS style switchers that will change the bacground image dynamically without reloading the page? I've found a few that will change the BG colour of the page - not many change the BG image.

  Thanks

  Jan 28, 10, 9:15 p.m. – Permalink

• version3

  http://www.qbn.com/filter/all/pu…

  • http://www.qbn.com/t…– version3

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJan 28, 10, 9:19 p.m. – Permalink

• BusterBoy

  Not exactly what I was after mate.

  What I mean is when you click a link on a page, the background image switches to a new BG image without the whole page being reloaded.

  • ah, still jquery though– version31/2

    look for a jquery css swap– version32/2

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJan 28, 10, 9:38 p.m. – Permalink

• acescence

  this should get you started..
  http://culturekiller.com/qbeans/…

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJan 28, 10, 9:55 p.m. – Permalink

• noiseisthis

  var bgList = ["http://src.to.bg.com.jpg", "http://src.to.bg2.com.jpg",...]

  $(document).ready(function(){
  $("body").css("background", bgList[i]);
  $("#button").click(function(){
  i++
  if(i>bgList.length) i=0;
  $("body").css("background", bgList[i]);
  });
  }

  you need to dl jquery to do this ^^^^

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earJan 29, 10, 12:04 a.m. – Permalink

• BusterBoy

  Thanks for everyone's help on this. The code that is working is below - it triggers on mouseover:

  <script type="text/javascript">
  $(window).load(function(){
  $("#linky").mouseover(function...
  $('body').css("background-image... bg-pink.gif )");
  return false;
  });
  });

  Then the HTML trigger:
  a href="#" id="linky">clicky</a

  Just wondering how I could accomlish the trigger from within flash?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earFeb 3, 10, 7:35 p.m. – Permalink

• noiseisthis

  flash:
  import flash.external.ExternalInterface...
  import flash.events.MouseEvent;

  trigger_mc.addEventListener(Mous... onTrigger);
  function onTrigger(event:MouseEvent):void {
  // the method that you want to call in javascript goes in the quotes
  ExternalInterface.call("trigger...
  }

  --------------------------------
  javascript:
  <script type="text/javascript">
  $(window).load(function(){
  $("#linky").mouseover(
  trigger();
  });
  });

  function trigger() {
  $('body').css("background-image... bg-pink.gif )");
  return false;
  }
  </script>

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earFeb 3, 10, 8:42 p.m. – Permalink

• noiseisthis

  use this instead http://pastebin.com/m716b9290

  • struggling a bit here buddy...can I send you an email?– BusterBoy

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earFeb 3, 10, 8:48 p.m. – Permalink