Grow your CSS skills. Land your dream job.

Showing external HTML pages without iframe/target=”iframe”

  • # January 18, 2013 at 4:07 pm

    I don’t like using iframes to show external HTML pages because Firefox and IE don’t display the width and height properly inside the iframe. Is there an alternative way to show external HTML pages on the very same page? i want external HTML pages to show inside the white area of this website[Website](http://codepen.io/Jarolin/full/bwLJs “website”).

    # January 18, 2013 at 4:11 pm

    External sites or internal site pages?

    # January 18, 2013 at 4:13 pm

    @AndyHowells internal site pages

    # January 18, 2013 at 4:19 pm

    And are these pages filled with the content to load within that area on an action, like clicking the nav for example?

    # January 18, 2013 at 4:22 pm

    Yes. They are simple HTML pages only with the content i want to display. And they will appear when the nav buttons are clicked.

    # January 18, 2013 at 4:26 pm

    Okay, your best bet then is AJAX. Basically you can use JQuery to call the content based on which nav item the user clicks and then load it in the content container.

    Details all about AJAX here – http://api.jquery.com/jQuery.ajax/

    Note that this method is not necessary very good for SEO purposes as you’ll only have the single page and none of the external content will be indexable as it’s not in the source until called in.

    Is there a reason you’re not simply using multiple pages?

    # January 18, 2013 at 4:28 pm

    A decent example with demo here: http://css-tricks.com/ajax-load-container-contents/

    # January 18, 2013 at 4:41 pm

    @AndyHowells Thanks for all the help. I’m simply doing it this way because i think it looks good and its really easy to use without having to scroll. But i think your right about the SEO thing. I want my website to be easily found on Google. What do you suggest i do?

    # January 19, 2013 at 8:22 am

    Use proper paging, so have everything seperated into different pages.

    If you want some sort of transition you could use CSS transitions to load the content area slowly.

    # January 19, 2013 at 9:00 am

    That’s basically what it is. The pages will be located in different directories andon the same domain just like any other website. The only difference is that those pages will show inside the iframe. I really don’t understand what the huge difference is.

    # January 19, 2013 at 9:02 am

    Ooops. I confused this discussion with another.

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".