0

I'm trying to style a Facebook Like button iframe with jQuery, the markup is :

<div class="fb_like_post">
    <iframe src="facebook.com/..." scrolling="no" . . .>
</div>

My jQuery code is :

jQuery('.fb_like_post iframe').ready(function() {
    jQuery('.fb_like_post iframe').contents().find('.connect_widget_like_button  .liketext').css('color','red');
});

Doesn't work. In fact I can't apply any style to any element of the iframe. Why ?

drake035
  • 3,955
  • 41
  • 119
  • 229
  • 1
    Because it's not your markup, it's facebook's, and they don't want to style it, they already took care of that! – adeneo Mar 04 '12 at 16:34
  • If they wanted everyone tinkering with their branding, they'd give everyone the option. – Sparky Mar 04 '12 at 16:38
  • possible duplicate of [Facebook, how to change like button image?](http://facebook.stackoverflow.com/questions/4920945/facebook-how-to-change-like-button-image) – ifaour Mar 04 '12 at 17:27
  • check *my* [answer](http://facebook.stackoverflow.com/questions/4920945/facebook-how-to-change-like-button-image/4922223#4922223) in the duplicate and not the accepted one! – ifaour Mar 04 '12 at 17:28

1 Answers1

0

This cannot be done via simple JS/CSS due to browser security limitations.

zatatatata
  • 4,761
  • 1
  • 20
  • 41
  • Well actually it can, with either pointer events or hiding the iFrame, but it's against facebook TOS, and it's generally not a good idea, but it is technically possible with a little css. – adeneo Mar 04 '12 at 17:42
  • @adeneo what I meant was more in general about cross-domain frames, but I guess a completely different approach could work. Thanks for the input. – zatatatata Mar 04 '12 at 18:00