iframe that shows a certain part of a website

i have domain.com it has a 300x250 box with in t开发者_Go百科he overall site i want to create a widget with and allow other people to put it on their site.

the 300x250 box is mixed in with a lot of other stuff and i can not put that 300x250 box on its own page since it is dependent on other stuff.

i have found similar threads on stackoverflow that say the following work

<div style="overflow:hidden; width:608px; height:270px;">
  <iframe  scrolling="no" frameBorder="0"
  src="http://tech-revolution.com/forum/vbshout.php?do=detach&instanceid=1#dbtech_shoutbox1" 
  style="width:728px; height:270px; border:none; margin-left:-60px;"/>  
</div>

or

$('#target-div').load('http://www.mywebsite.com/portfolio.php #portfolio-sports');

i did the first one and it works fine the second one i didnt get around to yet.

my question is which one of these methods is "better" or is there a different way to show a PORTION of a site on other websites?

Option 1 - IFRAME

Pros

• Will work

• If your iFrame content has links/postbacks these will continue to work (within the iFrame).

Cons

• The main windows OnLoad event is postponed until the iframe has completed loading, which can give the user the sense that the page is taking longer to load, they are also alledgely more expensive to create.

Option 2 - JQuery/DIV

Pros

• Can be scripted to load after the parent page has loaded to give a more responsive feel.

• Once retrieved, the content will be in your domain so there's scope
  for the client to manipulate style/content of the DIV content.

Cons

• Won't work as its cross-domain, there are ways around this though:

• Any postbacks and links maynot work if relative paths have been used, likewise stylesheets and images in that content.

Summary

IFrame for simplicity, DIV would require more work but potentially could be more flexible and arguably faster.