Member Avatar for samson.oba.77

Hi! I want to put a html file into another html file . I tried iframe and object tag, which works but the problem is i also get scrolling frames. How can i insert a html file into another html file as it is without anything added to it like scrolling bars ?
Thx !

  • 5 Contributors
  • 6 Replies
  • 23K Views
  • 2 Days Discussion Span
  • Latest Post Latest Post by samson.oba.77

Recommended Answers

All 6 Replies

Member Avatar for tdrosiadis

The best way is server side using either php or asp.net or any other server side language.
If server side is not an option for you than sticking with your iframe you can hide bars like this in css:
<iframe src="/path/to/file.html" seamless></iframe>
iframe[seamless] {
border: none;}
Remember though that iframes have many, many disandvantages.
Another way can ve JavaScript. You can see some hints here:
http://www.boutell.com/newfaq/creating/include.html
and here:
http://www.html5rocks.com/en/tutorials/webcomponents/imports/

Member Avatar for Alicera Nz

You can do with two option, pure HTML or javascript/jquery:
for example, you have a file "footer.html" to be included in index.html

  1. in Javascript

    <script>
    $(function(){
    $("#include_html").load("footer.html");
    });
    </script>

inside <body> tag (or, where you want to include the file (footer.html)), place this:

<div id="include_html"></div>

Note: If you have more than 1 file included, just add new line below $("#include_html").load("footer.html"); with different Selector, as in;

<script> 
$(function(){
$("#include_header").load("header.html"); 
$("#include_footer").load("footer.html"); 
});
</script>
Member Avatar for diafol

Note that .load() requests files from the server.
An alternative would be to use SSI (server side includes):

http://en.wikipedia.org/wiki/Server_Side_Includes

<!--#include file="footer.html" -->

However the "containing page" should have the specific extensions .shtml, .stm or .shtm. That is sometimes a deal breaker for some. If you don't want to use php or asp or any other flavour of full-blown server side language, SSI could provide a simple fix without needing to include a js library. SSI will work even if the user has js turned off (rare but a possibility).

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.