I have google analytics graph in my home page, via google charts api, and it takes lot of time to load the entire page. If the charts are turned off the page loads faster.
how can i load the entire page quickly and then allow google charts to show using loading.gif. I think its Ajax,
cant figure out how and where to start.
I think you just need to hold off loading the image until the rest of the page has loaded. No AJAX required. Just move the scripts to the bottom of the page, immediately before the closing body tag.
So, looking at this page:
http://code.google.com/apis/analytics/docs/articles/gdataAnalyticsCharts.html - The drawChart() function won't be called until the last possible moment.
Related
I have a small rental car business and have an existing PHP website that presents our fleet and accepts online reservations using a series of PHP pages and SQL database calls. The system works very well, however I would like users to be able to move between pages of the website without the browser going to the usual blank page in between.
I have made an attempt at using AJAX to asynchronously load content of the pages in question into a "container" page, however I have not been successful in achieving the required result. The pages are heavy with PHP code and when I attempt to load content asynchronously using AJAX I get load issues that I cannot seem to resolve.
I understand that the AJAX load() method allows content to be asynchronously loaded into a container such as a DIV element, however I am wanting to know if this method can be applied to the full page content. In a sense, the full of the page would be the container for the content of each page to be loaded into.
Ideally, each separate page would load in the background with a semi-transparent loader overlay (like an animated moving loader bar) would sit over the current page, and the target page would be loaded and then the overlay removed to fully reveal the new page content. The user would see the loader overlaying the current page content, then would see the new page content without seeing a blank page in-between.
Can the AJAX load() method somehow be applied to the full page rather than to a DIV, and would there be an effective way to apply this method to some or all existing pages without a large amount of rework to the existing page content?
Many thanks,
Scott.
Is there a way to load whole new URL / page inside my site element so that you can interact with that page without refreshing my page? It's not a problem if it initially has to load with page refresh.
jQuery.load()?
jQuery.ajax()?
All I could find online was loading parts of your own site and there was no info about using that loaded page without refresing your own page. Example:
jQuery(document).ready(function() {
jQuery("#dynamic").load("single.php");
});
I've previously loaded new pages inside modal but I need it inside div or anything else without "overlay".
I think you are trying to inject content from another domain.
that means you want a part of your page load another domains content.
this page demonstrates the issue very clearly. take a look there and read the answers carefully.
I am new to codeigniter. I have created a page that has lot of contents on single page. I want to load those contents in a fancy way like it should load some contents and as we scroll down and reach at the end of the page then it should display some sort of loading feature and load other contents and so on..
The example of such websites can be seen in social networking sites such as Facebook, Twitter or Quora.
I have thoroughly searched for it and unable to find anything suitable.
Any help will be appreciated.
Thanks
What you need is a "Infinite scroll" plugin. If you google that you can find some plugins like infinite-scroll and jScroll
The basic functionality of these plugins is to "monitor" the users position and, at the end of just before the page content ends, the plugin makes an $.ajax request to get more results and add those results to the dom.
How do you do dynamic refresh of a single div tab using php/ajax and have the content actually change the local html on the page (so that it is changed when you go to ‘view source’ in a browser) instead of just putting the change in a JavaScript object? I am trying to design a webpage that loads search results without refreshing the entire page. I use a simple hash followed by a GET/query string request to determine what content to load. This gets passed to a JavaScript XMLHttpRequest, then to some php which picks up the GET and passes it to a SOAP service and finally echo’s the SOAP results back to the XMLHttpRequest to get displayed in a document.getElementById div change. This works fine for usual display in conventional browsers. However I am concerned that search bots and screen readers are not going to recognize the majority of the content that shows in browsers because it is all contained within a client side JavaScript object.
So, I guess my first question is: is this a valid concern? If it is, is there a work around?
Thanks!
AJAX content is very hard to get indexed. Google has webmaster guidelines for AJAX. This should get you started in the right direction on getting your content indexed.
I'm inexperienced with search engine behavior but as far as i know the best option is to load the full content of your div on a php page, when the page load you can include that page inside the div, and then start using js/jquery to refresh that every so many seconds.
this way when a search bot gets on the site it will see the current content, and users will see it update.
updating the div box can be done quite easy using ajax function and jquery.
My website is setup like: when the page loads, a jQuery animation -- in the template -- is played which, on completion, further makes an Ajax call to fetch the content of the page. Now, I want to deploy hashbang like http://com-address/#!page and I need to retain the animation at the page load as well. But I assume the problem with this setup is; when the web-crawler visits the page, it doesn't wait for the animation to complete and make the Ajax call. It requires the state of the page with the loaded content (which, in my case is acquired after the animation is completed).
Given the above scenario, which way is better:
Change the entire flow and load the page content preemptively and hide it
till the animation is played.
Only when the hash-bang or _escaped_fragment is found in the URL:
a. follow step 1.
b. load the page with the content without animation.
My assumption about the web-crawler is incorrect & let the
current flow as it is.
Any heads-up advice?
EDIT
#kdzwinel, thanks for the tip about text-browsers!
On the second thought, I'll go with the option 2(a) because when the crawler visits the resource with fragmented URL, it should get the full resultant content on the page. And if the user navigates directly to the fragmented URL, the user-experience with animation would be intact too (by removing the content on the dynamic content fragment between the page load and the animation starts).
Also for all the other scenarios, we would continue the old flow (animate then fetch via Ajax) because we don't want to refresh the page since the user is already visiting the website and trying to navigate smoothly/seamlessly using anchors with fragmented URL (binding their click events to begin animation).
Web crawlers don't execute javascript (webmaster guidelines -
If fancy features such as JavaScript, cookies, session IDs, frames, DHTML, or Flash keep you from seeing all of your site in a text browser, then search engine spiders may have trouble crawling your site.
), if you wan't your content indexed go with option #1. Load the content when page is opened and if browser supports javascript - hide the content and show the animation.