We Keep Coding

Hide another page's button

I want to load another site's page (e.g: www.a.com/b.html) on my site's page. TO do that I use an iframe to do that. But in that page (b.html), there is a button that I need to hide. Is there any way to hide that button with javascript or jquery.
Is there any other way to get the content of that page and edit some and display on my page.

$().contents should allow you to access the elements within an iFrame
$('iframe').contents().find('#btnId');

Is it possible to place a loader image inside an iframe while its loading its content?

I'm working inside a Facebook tab iframe content page and since it takes a few seconds to appears the iframe content of my site I'm wondering If I can place a loading gif inside the iframe to show first (maybe as a body background image) while its loading the rest of the content.
I see that the iframe ussually cames with all the images. So I'm wondering If there's any way to do this or the content of the iframe loads and is displayed all together.
I tried the image as body background and it didn't work. Both came together.

You can't modify the contents of an iframe that comes from a different domain.
But, you can use absolute positioning from your main window to put an image over the top of the embedded iframe which can probably accomplish what you want without a lot of complication or change of your main page design.
Here's an example: http://jsfiddle.net/jfriend00/DajS4
If your code is in the iframe and you want something displayed before your page loads into the iframe and you don't control the parent, then there is nothing to do. You can't do anything dynamically until your code is loaded and by then the page will already be starting to show.
All you can do is to make something on your page load very, very quickly (perhaps like a small image in the first tag of the page) that should be one of the first things to show and then when your page successfully finishes loading, you would hide that small image. Other than making something show quickly, you can't do anything until you load so you can't show anything before you load. It would have to be the parent window that created you that did something earlier.

Umm,
I understand what you are trying to achieve. but the only way i know to achieve this would be to use ajax to load all your content.
Set the ajax function to run on page load. And in the body of the page place one of those gif loaders..
hope u understand what im trying to say!

You can use AJAX to load your page.
<div id="loading">loading..</div>
<div id="content" style="display:none"></div>
$(function() {
$('#content').load('http://url', function() {
$('#loading').hide();
$(this).show();
}
});
note: the location of all your javascript should be at the bottom of the page to improve load speed.

Fancybox page anchors

Is it possible to use page anchors (http://example.com/page.php#jump_to) in Fancybox and if so how?
I have tried like you normally do with a normal HTML page, where it works, but it doesn't work in Fancybox.

If you use an iframe to display the Fancybox content, then I suspect anchors will work.

How can I get Colorbox to appear in a div?

At the moment I've got Colorbox setup so that it starts automatically when the page loads, but I need to place it in a div on the page, instead of hovering in the center of the page. How can I do this? Thanks for reading.

You can do insert this javascript snippet into your javascript on document complete, where you bind colorbox.
$(document).bind('cbox_complete', function(){
var divContent = $('#cboxLoadedContent').html(); // Grab the content of cboxLoadedContent div
$('#colorbox').hide(); // Hide colorbox div
$('#cboxOverlay').hide(); // Hide the overlay div
$('#Output').html(divContent); // put the content inside the specified div.
});
What this does is that after the image/page is successfully loaded into colorbox, it will immediately grab that content, hide the colorbox and overlay, and dump that content into the new div.
Yes, you will see opening and closing of colorbox flashing on your screen really quick, but this will do it. If you want more controls, then you customize these events: onOpen or onLoad. See link at bottom of my post to go to colorbox website for more details.
Beside cboxLoadedContent, you can also use #cboxWrapper, or #colorbox divs, depending on how much colorbox information you want to embed in your div.
Please note that by doing this, you will have to rebind the buttons, if you want it to allow navigation inside the div.
You can go to Colorbox Site for more customization options.

I think Colorbox is the wrong tool for what you want. The functionality you want is more like an image gallery. Some ones you might like: Galleriffic or Galleria

Firefox extension that overlays persistent iFrame?

Is it possible to build a Firefox extension that displays a floating, persistent iFrame over the page content?
I know it's possible to add iFrames using XUL. For instance, you can add an iFrame to a persistent sidebar. However, I want the iFrame to float over the page content, not cause the content to shrink. So far, my only option is to add the iFrame to the DOM, then use CSS "fixed" positioning to float the iFrame.
The iFrame must also persist across page loads, exactly as the sidebar does. Adding an iFrame to the DOM, unfortunately, causes the iFrame to vanish when the browser renders a new page (e.g., after clicking a link).
Any clues?
Thanks!

Another add-on you can look at is Shopping Helper It has an iframe at the bottom whenever the page is displayed a product

Yes. I was able to do this by setting the attribute noautohide in the panel you use.
E.g.
<panel id="yourOverlay" noautohide="true">

You might be able to do something like this with Greasemonkey, it allows you to customize how web pages look and you could make your script available to others.