How to open part of my page content into own broswer? - javascript

if I have a page:
<body>
<div id='part_one'>...</div>
<div id='part_two'>...</div>
<div id='part_three'>...</div>
//Create a link here to open the content of div `part_two` in own browser
</body>
I would like to create a link on the page, when user click on the link, the content of div part_two will be opened in own browser, how to do it?

Open #2 in new window
This is a horribly crude way to make such a link, though. If the data must be opened in a new window, you always need to provide a fallback page (put that in href) and use unobtrusive JavaScript, so bind the click listener in your script and not like my example.

Related

Is there a way to close tab opened by a script from an iframe?

I have added an iframe to my webpage that is used for converting video links to mp3 format.
iframe shows a button that, when clicked, opens a new tab before starting to download the wanted mp3 file. I would like to know if there is a way in javascript to close that newly opened tab to ensure a better user experience. I know that window.close() can do that, but not sure if we can apply that to a tab opened by a script from an iframe.
This is the iframe in question, It sends a get request to the link specified in the src attribute.
<iframe id="downloadIframe" src="https://loader.to/api/button/?url=${vidLink}&f=mp3&color=0964D3"></iframe>
When the iframe is loaded, you can see this in the code it loads with it:
<a id="downloadButton" onclick="onClick();window.open('https://loader.to/ajax/a.php');" href="#">
I believe that the opened window is caused by window.open().
Knowing that I cant change the code that is within an iframe, any idea how I can close that tab?
Open the dowlnoad in a iframe instead of a tab.
Then you can later drop the iframe from the DOM making it disappear.
you can block the iframe from opening new tabs by using the sandbox attribute.
sandbox=""
Sandbox Applies extra restrictions to the content in the frame. The value of the attribute can either be empty to apply all restrictions or space-separated tokens to lift particular restrictions.
You can read more about it here

Can I display a popup over a CFDOCUMENT page?

Here's what I'd like to do in Coldfusion:
On a webpage there is a "Download" href link and I want another browser tab to open when the user clicks this link. In the new tab, I am creating a PDF via CFDOCUMENT in Coldfusion. This in of itself works.
However, since the PDF has a delay before it loads in the tab, I want to display a popup to the user that the PDF may take a few moments to load.
So what I tried to do was this sequence:
User clicks "Download" ->
On the same page, I trapped the link with jquery and displayed a popup
window alerting the user there may be a delay ->
User clicks OK on the popup ->
Using javascript window.open, redirected to a new browser window for the PDF.
This was unsuccessful because using window.open in javascript is not trusted by browsers and the new tab doesn't show up because of popup blockers.
So then I thought I'd create a popup in the new browser tab instead before the PDF loads, but discovered I can't use javascript on a page with CFDOCUMENT.
Any ideas as to how to best accomplish this if anything can be done?
I think iframe might be your friend here. It allows you to display another document in the pdf page.
Using your example in the comment, I created two files: one to display the prompt message and one to display the PDF.
cfprompt.cfm
<body>
<div> this is a test </div>
</body>
<cfflush>
<iframe src="pdf.cfm" >
</iframe>
pdf.cfm
<cfdocument format="pdf">
<h1>Hello ColdFusion</h1>
<p>This is <strong>PDF</strong> example document.</p>
<p>Genereated at: <cfoutput>#TimeFormat(Now())# on #DateFormat(Now())#</cfoutput></p>
</cfdocument>
You're still going to have to play with the formatting/sizing of the iframe so that it displays correctly, but hopefully this allows you to display the PDF.

In an iframe based website, how to load all iframes in a new window after user clicks on a link within one iframe?

I am having a problem with an iframe (Java servlets) based website which looks somewhat like this:
<!DOCTYPE html>
<head></head>
<body>
<iframe id="top" name="top" src="$link.setAction('top').relative()"></iframe>
<iframe id="content" name="content" src="$link.setAction('content').relative()"></iframe>
<iframe id="footer" name="footer" src="$link.setAction('footer').relative()"></iframe>
</body>
</html>
Because each of the iframes is a standalone page, if a user decides to open a link from within any of the iframes, the page that is loaded in a new window or tab looks broken as it is only one part of the whole website.
I was wondering if there is a way to detect whether the user chose "open in a new tab" or "open in the new window" from the browser. Then, I would have to make sure that after this happens, all the iframes are loaded in a new window.
Let me know if there is a better solution, as well.
Use the target attribute to solve your problem when user is navigating through the iframes.
Your iframes are already named top, content, and footer. You can also place the three iframes inside of a parent iframe, which you can then name something like main_iframe.
Then for your links, specify the name of the iframe you want them to open in using the target attribute.
Example link inside the top frame which opens only in top frame
Example link inside the content frame
Example link inside the bottom frame
Example link which opens in the parent frame
You can then disable the right click event using Javascript oncontextmenu:
window.oncontextmenu = function() {
return false;
}

open link out of iframe

I'll try and keep this short. I have a page with various section. One section has an iframe with a google map in it. On the infowindows i have a link which when clicked i would like it to open in a fancybox over the page(not in the iframe...i can do that). For example if i had a link saying "google", id like it to open http://www.google.co.uk/ over the whole page in a fancybox.
I have 2 different pages and 2 javascripts, 1 for the map(iframe) and another for the main page. The function is in the main page script.
Where i think im going wrong is a) the right call to open the page b) attaching a class to the javascript i.e class="fancybox".
My map info window has this link in it(map.js):
some content
In my main.js:
function openSomething() {
//this is where i think im going wrong
//ive tried window. and top. etc
var url = "http://www.google.co.uk/";
document.location.href = url
};
My call to the fancy box is in the main page.
Any help would be much appreciated.
No need to use JavaScript: set the desired link as the href attribute, and use the target attribute to define where it is opened.
target="_top" will open the new link in the entire page
target="_parent" will open it in the parent frame or page
target="_blank" will open it in a new window.

Links in colorbox iframe opening in new window

This is a tricky one. I have a link on my page that opens a Colorbox iframe to an external website. The external website contains links to another page. When the user clicks those links, I need them to load up in the same iframe.
The problem is, the link on that external site is set to open a new window with target="_blank". Therefore, instead of this page loading within the same colorbox iframe like I need it to, it opens a totally new window.
Is there any way to bypass it so that these links within the iframe do not open a new window, and instead load that window within the same colorbox iframe?
Thanks in advance!
_blank will always open a new window, you could try _TOP instead, it should work something like this;
<a onclick="parent.$.fn.colorbox.close();" href="NEW SITE" target="_top">
open in parent window with animation
</a>
Do you control the document that is being displayed in the iframe? If so you could handle things a little differently so that you only opened new windows if the document isn't being displayed in an iframe. But if the document you are iframing isn't under your control then I don't think there is anything you can do about it.

Categories