i have embarrassing question concerning to elementary knowledge of HTML
I would like Open/load second page in my first page
Menu button which loads second page -
<li class="current">About us</li>
part of my firstpage is called "myContent" but (Opening of second page) doesn´t work properly (Page is opened in another Window)
<div id="myContent" name="myContent" style="background-color:#EEEEEE;height:200px;width:800;float:left;"> </div>
What amI doing wrong? Thanks
You should replace your div#myContent with an iframe:
<iframe id="myContent" name="myContent" style="background-color:#EEEEEE;height:200px;width:800;float:left;"> </iframe>
You may need to add some additional styling here.
Or you can use AJAX to load content with JS.
Use this instead of the div
<iframe id='myContent'></iframe>
Related
i just get into a small problem.
i tried to include iframe inside and also outside of div code but nothing show
adding like frameborder="0",etc didn't work either
then i tried on another .html file to make sure the iframe is good and it's showing like usually.
so why the iframe won't opened the src file, did i do something wrong ?.
heres my code (the problematic one):
<html>
<head>
<title>Buat.in</title>
</head>
<body class="container">
<div>
<div class="additional-ui">
</div>
<div>
<iframe src="backgroundui.html">
</iframe>
</div>
<div class="ui-bttnmenu">
<ul>
<li>Tentang
</li>
<li>Daftar Desain
</li>
<li>Lokasi
</li>
<li>Hubungi
</li>
</ul>
</div>
<footer class="foot-ui">
<p>Designed & Written by :</p>
and also i haven't applying the separate style file here, the class="" will be linked to my style later, i test it on firefox 85.0.1 ubuntu.
(Edit) heres the additional info for backgroundui.html:
<html>
<body class="secondary-ui-container">
<h1>Buat.in</h1>
<p>Your "trusted designer"</p>
</body>
</html>
fun fact theres something happened, when i run iframe inside the background.html (supposed to be the ui) the iframe works normally else on the main page.
or should i rebuild all from zero again ?.
Firefox has recently implemented a security feature which does not allow cross tab tracking which is the fundamental of iFrame. Previously, this feature only prevented only https and ssl certified sites.
You may change this behavior in your own Firefox installation by typing about:config in the address bar and setting security.mixed_content.block_active_content to false.
Here are some more docs about x-frame-options:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
So i have an HTML file my problem is i want to create an "About Me" section in one DIV section, the issue is the About Me section is rather long and contains a lot of text and as a result of that makes the code look untidy. I mean from a functionality point of view it works but i like making HTML files look as good as i can.
Is there someway i can link my about me section from a separate HTML file containing just that info, almost has is if it was a separate class in OOP and i am in essence just calling to an 'About Me' object?
You can simply use an <iframe> for that, pointing to your other HTML file.
<html>
<head>
..
</head>
<body>
...
<iframe src="link/to/your/file.html" scrolling="no" frameborder="0" ></iframe>
</body>
</html>
I am creating a website with navigation that causes a page-jump. But when the page-jump event is executed my page will not load properly, and most content above the called is not loaded. Here is a copy of my navigation:
<div id="navbar-type">
<ul>
<li>BEAR SOUP</li>
<li>FIAT MOTORS</li>
<li>NEWSEUM</li>
<li>TEXAS PARKS</li>
<li>ZACH THEATRE</li>
<li>GUINNESS</li>
</ul>
</div>
How can I fix the code so that the items above the page-jump are visible?
Thanks
you just need to put <a name="bear-logo"> where you want the page to scroll to when the user clicks the link and the same for the others. For example, if you wanted to scroll to the <p> tag below, you could do it like this:
BEAR SOUP
<!--More Code-->
<a name="bear-logo">
<p>Bear Soup:</p>
There doesn't seem to be any error in the displayed HTML. However, you shouldn't need to include the target for inline page anchors.
I assume you actually have the links on the page. For example, <a id="bear-logo"></a>, <a id="fiat-logo"></a>, and so on.
Moreover, the issue you describe seems to indicate that there is some invalid code elsewhere on the page (perhaps JS or jQuery). I'd recommend commenting out sections of your HTML until you isolate the interfering culprit.
BTW, have you considering using a simple jQuery script to flow the navigation to the logos instead of just abruptly jumping to them?
I have a link on one page that needs to go to a different page, but load to a specific section on that other page.
I have done this before with bootstrap but they take all the 'coding' out of it, so I need to know how to do from scratch. Here is the markup I have based on this link (not the best resource, I know): http://www.w3schools.com/html/html_links.asp
**Page One**
<a href="/academics/page.html#timeline> Click here </a>
**Page I am linking to**
<div id="timeline" name="timeline"> ... </div>
Can I do this with just HTML, or do I need some JavaScript? If I need to do it via JS, it needs to be on the target page, right?
I believe the example you've posted is using HTML5, which allows you to jump to any DOM element with the matching ID attribute. To support older browsers, you'll need to change:
<div id="timeline" name="timeline" ...>
To the old format:
<a name="timeline" />
You'll then be able to navigate to /academics/page.html#timeline and jump right to that section.
Also, check out this similar question.
You can simply use
<a href="directry/filename.html#section5" >click me</a>
to link to a section/id of another page by
To navigate to a section of another page use:
<a href="example.html#example-section>name-of-link</a>
The example.html would be the page you want to go to, and the #example-section would be the name of the id on that page that you want to navigate to.
To link from a page to another section of the page, I navigate through the page depending on the page's location to the other, at the URL bar, and add the #id. So what I mean;
This takes you #the_part_that_you_want at the page before
I tried the above answer - using page.html#ID_name it gave me a 404 page doesn't exist error.
Then instead of using .html, I simply put a slash / before the # and that worked fine. So my example on the sending page between the link tags looks like:
El Chorro
Just use / instead of .html.
To link from a page to another section just use
my first div
I have a page that contains an iframe element. I want to have some text on the main page when clicked to change the iframe source. I can do that with an "a href" tag but the main page resets to the top instead of where the user was last on the page vertically. If I use an input type=button element, then it works just fine without resetting to the top of the main page. However, I want the look of just text on the page (with an underline) instead of a button look. How can I do this?
use target
Go to page 2
<iframe src="page1.html" frameborder="0" name="test"></iframe>
you can use a div or span (actually pretty much any element) instead of a button
<div onclick="iframe.src='new.html'" class="lookcool">sometext</a>
Not sure what you have done so far, but it seems like you want to change the page displayed in an iframe. To do that with a link, you can use target or javascript:
Target:
link
<iframe name="iframe" src="http://www.example.com" />
Javascript:
link
<iframe id="iframe" src="http://www.example.com" />