JQuery: Lazy Load Tabs in HTML

This project was awarded to Satsume for $55 USD.

Get free quotes for a project like this
Project Budget
$30 - $250 USD
Total Bids
Project Description


I have a functioning HTML/JS/Jquery setup which allows for the end user to click on a tab to show the contents of the tab. This works perfectly.

Currently, even though the user can only see one tab at a time, all of the content in all of the tabs load upon the page loading. I want the tabs to load as they are viewed.

For example, when you load the page, only "Tab 1" should load. "Tab 2" and "Tab 3" should not load until they are clicked on.

I am currently using the "Net" Tab of Firefox's firebug add-on to test and see what is being loaded.

Note: This project will most likely not need AJAX. I would prefer if you can find a solution that works using the existing setup of HTML/JS/Jquery. All of the content will be called from the same page and is not available in a database or anything. The content in the tabs can be anything (HTML, Videos, Images, Text, etc).

The final product needs to support all major browsers (IE, Chrome, Safari, FF, Etc).

I have attached my sample html file for you to see.

The budget for this project is not huge; hopefully, you can bid reasonably.

I look forward to working with you for this project and many future projects to come!

Awarded to:

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online