jQuery to change global css property from within an iframe

Question

I have using colobox which is a jquery modal window to create a login/regiestration process through modal pages called in an iframe. I am hoping to be able to switch the css from a link within the iframe. I am trying to change the height of the modal window when switching between ajax pages within the iframe. If I try something like this it does not work..

$(".link").click(function () {
  $('#a').css('height', '763px!important');
  });

Is this possible or should I go to sleep now?

Answer 1

$('#a, #b, #c').css('height', '763px!important');

http://api.jquery.com/multiple-selector/

There's also a list of all available selectors on jquery website, checking it out might be useful.

edit
Regarding iframe issue, you can access parent window containing this iframe with parent variable. For example, this will redirect parent browser window to home google page: parent.location.href='http://google.com'.
I never tried this with jquery, but maybe something like $(parent.document).find('#a') will perform search in the parent document too.

https://developer.mozilla.org/en/DOM/window.parent

Answer 2

jQuery('selector1,selector2,seleccto3....').SomeAction(); 
//separate sectors with comma

in your case

jQuery('#a,#b,#c').css('height', '763px!important');