I want to know, how we can do the page reload but while loading the page we keep some conten on page visiable.
In real senario, google or facebook load new page or chages some part of the page(not using the ajax) but there header or footer are not get change means stick to page and it visible through-out the process to page load start and end.
Can anyone tell me how it has to be done?
well, your examples don't reload page. They load new content with AJAX, so while loading you can execute your scipts and display current content. After you can append new blocks to page and change url using HTML5 History API.
Related
I am building a website and when I click on one of my header's page links, it loads the whole page again, rather than preserving the header and only loading the main content. For example:
When you click on a button on the sidebar of YouTube, it will, for example, load the watch later playlist, and preserve the search bar and sidebar. How would I go about doing this on my website?
Have a look at using aJax. This should resolve your issue.
I have an iframe element that contains a music player via SoundCloud. When a user switches tabs, it reloads. Is there a way to load the new page in the background and keep the iframe as-is?
Edit
I'm using Rails.
pjax might be what you're looking for.
This gem allows you to load pages in the background using ajax and reloads only the divs you really need
We have a common navigation bar on each page.
How would you cache this so it is not loaded on every page?
You could load it using AJAX in the onload event of each page and append it in the respective navigation container on your page.
As long as the request to the menu stays static, the browser should be able to cache the response. Hence, you have basically cached your menu on the client's browser.
Put the content into a variable inside a javascript file navigation.js
nav_bar = "....."
Then include this navigation.js on each page and insert the content in the current page via JavaScript.
I use the same iframe in multiple pages of my web application. I want to have the iframe load once on the login screen and then when brought to the next page the same exact iframe will still be loaded and not refreshed.
Is there any way to keep a part of a webpage loaded and static when directed to the next page? Some sort of static footer with the iframe would be great.
Any help is appreciated thanks.
In the case of submitting a form or using a link, you can target yet another Iframe on the page. The target will load the new page, leaving the original alone.
Is it possible to refresh only one frame in the windows and not all the frames?
My problem is that i have a page index.php and inside there are two frames - menu and content. when the user clicks on refresh(f5) the index.php has been loaded again and the content page is blank.
What can i do?
If you are familiar with javascript's usage in page refresh. You can try that instead of traditional html do a job.
javascript:location.reload(false)
will do a page reload from the cache. Set this to your content page and for menu page you can set this.
javascript:location.reload(true)
What you can do is store the last page selected by the user in cookie (using client side code) then in the page load even (client side again) check for that cookie and if exists, load that page by default instead of showing blank page.
Using jQuery accessing cookies becomes really simple: http://plugins.jquery.com/project/Cookie