I'm wondering if it is possible to open a lightbox popup and redirect the parent page at the same time.
I have an ajax script that gets html as a response, i want to open a lightbox popup to show the html but at the same time the parent windows should redirect to a specific page.
This can be done but not in the normal document.reload() way. Rather than that, you would have to ajax the parent page content, then manually append it to a container in the parent page while the light box is visible! this will not interrupt the light box, but change the content of the parent page! Will be a tricky thing to do but, achievable.
Related
Is this even possible?
Background
I have a page that's basically just a logo and an iframe.
I have complete control over the parent page and can use whatever tricks I want (html, javascript, php, etc.).
The page in the iframe, however, is a third party page that I have very little control over. I can use no javascript, no css, I can't even modify any links. All I can do is modify some text.
Problem
I only need the logo on the initial page. Once the user logs in or clicks to a different page, I want that new page to open in the parent window. I know about target="_top" and target="_parent", but those won't help me because I have no real access to the links in the iframe.
Question
Is there any attribute I can put on the iframe or javascript I can use in the parent page that will force new pages in the iframe to load in the parent window?
So, I have a website I'm working on using javascript / jquery. It acts similar to an accordion, but for the whole site.. Links are positioned on the left side of the screen and when you click on one (let's say "about me") the current content (maybe the "home" or "contact" page) slides off screen and the "about me" content slides on screen. My issue lies when refreshing the page.
If the "about me" or "contact" content is being viewed and you click refresh, it resets and shows the "home" page content. I want the current content (if different than the "home" content) to remain visible when the page is refreshed.
Any suggestions on how to complete this? I've been playing with the "hashchange" event/function and can get my URL to update, but I still need the refresh to load the current content rather than the home page content every time.
Thanks for any help!
There are a couple of ways to keep something even if the browser gets refreshed:
1- Url parameters. In this case you add the current selected menu on the url like:
localhost?currentMenu=about
No when doing this you have to have a script to check that and select the corresponding menu onLoad.
2- localStorage
localStorage.setItem('currentMenu', 'about');
And then check it onLoad:
currentMenu = localStorage.setItem('testObject');
3- coockies
document.cookie = "currentMenu=about";
Remember all of these options require to do additional checking on load.
I have created a couple of pages whose content will be displayed in a pop up window.
I have a page where I define 3 links:
Page1<br />
Page2<br />
Page3
When clicking on the link, I have a popup displayed. But when clicking on another link, the popup is minimized. I need to keep it opened and display appropriate content from another page.
Unfortunately, I cannot use any javascript functions to focus my popup, since I need to put the links onto another vendor's website, that allows only simple html to be copied over, so when someone else will click the link, popup will open appropriate content.
Is there any way to achieve that with what I currently have?
The Facebook chat window remains open, unchanged, to refresh the page, or even when we change page. How to reproduce something similar? Tried with frameset, but it did not work.
How to keep a div open a window similar to the internal, even after refreshing the page or clocar on a website link?
Like them, you can try -
The data is shared between facebook pages. Probably HTML5 localStorage? Cookies? I'm not sure.
If you notice, they don't "refresh" the page, they ajax-refresh the content on the page for subsequent loads. (unless you manually navigate to the same page, of course.)
Finally, its all CSS mainly some z-index put to use.
I hope those 3 are enough to get you started.
I don't think the whole page of Facebook is loaded. Every link has it's own 'target'. Most of them fetch a page (I think with simply AJAX) to show, others to just change some partials of the screen. So let's say, you have two divs. One div is the chat-div. Positioning fixed and all, z-index on 100, it will always stay on top. The rest of the page is the other div. Within this div, you can load certain pages with AJAX, without the whole screen to refresh.
As with reloads of the screen: you can easily save (also with AJAX) whether the user closed the chat screen or has it opened. Just create a table in a database called 'chats' or something, then when a chatscreen is opened you put an entry in that table with 'person_1', 'person_2' 'lastmessage' and 'active'. When they close the chat, you can put the 'active'-field to false. Then, whenever someone loads the entire website, you check the table chats for active chats, and shows them when there are any.
I would look into qjuery-qjax: https://github.com/defunkt/jquery-pjax
From their docs:
pjax works by grabbing html from your server via ajax and replacing the content of a container on your page with the ajax'd html. It then updates the browser's current url using pushState without reloading your page's layout or any resources (js, css), giving the appearance of a fast, full page load. But really it's just ajax and pushState.
First of all I'd like to thanks in advance for your answers on this.
Currently I'm working on a site where I have a page that contains an <iframe>.
The page within the <iframe> has the Tinybox call to open the modal popup (that I want to overlay over the parent page), but the overlay stays within the <iframe>.
Is there a way to load the overlay over the parent page? If so, how do I do it?
Use this functinality in your code
window.top
For the moment, I'll just keep the script in a separate file and include that on every page.