I am setting up an iframe styled page. I have iframes for each piece of my page (header, menu, sidebar, content, etc).
My menu iframe had links in it;
<ul id="workMenuItems" style="display:none">
<li><a target="contentframe" href="work/courier.php" id="hrefcourier">Courier</a></li>
<li><a target="contentframe" href="work/scout.php" id="hrefscout">Scout</a></li>
<li><a target="contentframe" href="work/hunt.php" id="hrefhunt">Bounty Hunt</a></li>
<li><a onclick="back()" href="javascript:void(0)" id="back">Back</a></li>
</ul>
When I click on any of these (courier for example) it opens a new tab instead of loading that .php into the contentframe. I checked spelling and everything matches.
Also - I am using Chrome - not sure if that's a known issue off hand.
Thanks!
As a shot in the dark, I added the name element to my iframe and it worked. ID="" apparently isn't enough on this one. Thanks to anyone who looked!
Related
I want to use iframe to keep my story links in a list on the left side of my site and have the actual text of the story show on the right, in the lighter gray area, instead of a separate page. Each story is in its own html file right now. I have the page linked below so you can see how I have my link list set.
https://stf5123.github.io/Grimm_project/workstest2.html
You can use iframe.
<ul>
<li><a class="active" target="frame" href="GoldenBird.html">Golden Bird</a></li>
<li><a class="active"target="frame" href="hansinluck.html">Hans In Luck</a></li>
</ul>
<iframe name="frame" ></iframe>
the links on the homepage navbar is an easy scroll when click on it it moves the page the the section with id, but i need the user when they are on any other page not the homepage and click on any links on the navbar, it return back to the homepage and move to the section.
This code doesn't work for me.
How we Work
Try to remove the / before your URL
How we Work
This / is going to the root of your folder. I guess your using relative path, so this should fix the issue.
In your webpage you have this code within "tracking.html":
<h2>About Us</h2>
<ul class="discover triangle hover row">
<li class="col-xs-12">About EvisaXpress</li>
<li class="col-xs-12">Our Team</li>
<li class="col-xs-12">How We Work</li>
</ul>
This is linking to the current page, i.e. "tracking.html". Write instead
How We Work
and you should be fine.
The difference is that in your page this is called:
http://evisax.com/tracking.html#how-we-work
whereas this is what you want to call:
http://evisax.com/index.html#how-we-work
Removing scrolling.js from the Tracking.html file and everything works fine.
I have used bootstrap nav nav-pills nav-justified
and i have 7 of these
<li>Form</li>
I have been able to click on form which will re-direct to the form page, but I can't seem to return to my home page without clicking back on the browser. I want to be able to just click on the Home button which i've included as part of my 7 <li>s I mentioned earlier. Also i would like to be able jump onto each page from the navbar tab.
<div class="header">
<div class="container">
<ul class="nav nav-pills nav-justified">
<li><a href "#">Home</a></li>
<li><a href "#">About</a></li>
<li><a href "#">JavaScript</a></li>
<li><a href "#">JQuery</a></li>
<li>AngularJS</li>
<li><a href "#">API</a></li>
<li>Form</li>
<li><a href "#">Contact</a></li>
</ul>
</div>
</div>
So from that above, when i click on form, im on the form page, but i cannot go back to the homepage(index.html) unless i click back on the browser, i wanna be able to link to all the lists by clicking each other.
Consider using Ajax to load different pages dynamically (with association with jQuery it said to be simpler to use) for the desired behavior or put everything on the single page and show content only when user clicks the link by JS and CSS.
As soon as you use Bootstrap elements you probably have jQuery already included in your project.
Useful links:
jQuery Ajax
Hiding elements with CSS
Check this page jQuery.get there is a very demonstrative example
$.get("demo_test.asp", function(data, status)
{
alert("Data: " + data + "\nStatus: " + status);
});
where data - data received from the server. It should be your html code to replace the content.
To insert data use:
$.('#Content').html(data); //id="Content" is from the comment
if you do this in a local host and you created these files as i find out when you click on the home you get 404 page the only thing that you have to do is to link your homepage file to the home button if i'm wrong comment me and explain your problem more and then i will help you.
I have a list of menus as below, every menu link is an anchor. I am experiencing a very strange behaviour from anchor tag i.e., when I click on any menu it opens the requested page correctly. But on second click system duplicates the directory hierarchy and looks for the requested page where hierarchy does not exist. For example there is a page on path "Pages/Contact/test.aspx", 1st click opens the page. When user clicks 2nd time browser tries to open a page at path "Pages/Contact/Pages/Contact/test.aspx" resulting in exception "The resource cannot be found" error is thrown.
<div id="menu">
<ul class="menu">
<li><span>About Us</span>
<div>
<ul>
<li><a href="Pages/Contact/Phone.aspx" ><span>Phone</span></a></li>
<li><a href="Pages/Contact/Email.aspx" ><span>Email</span></a></li>
</ul>
</div>
</li>
</ul>
</div>
The problem is because you are using relative paths to your pages.
It works the first time because (I assume) you are in the root directory. So clicking the link takes you to 'Pages/Contact/Phone.aspx'. When in phone.aspx, if you click the link again, it looks for this page: Pages/Contact/Pages/Contact/Phone.aspx.
You need to add a / to the beginning of your URL to make it relative to the root of the site:
<ul>
<li><a href="/Pages/Contact/Phone.aspx" ><span>Phone</span></a></li>
<li><a href="/Pages/Contact/Email.aspx" ><span>Email</span></a></li>
</ul>
Or alternatively, because you're using ASP.Net, you can use the ResolveUrl() function to ensure all your links are relative to the root of the solution:
<ul>
<li><span>Phone</span></li>
<li><span>Email</span></li>
</ul>
I believe href="" is your problem here.
Try href="#" or href="javascript:;"
Can someone tell me, what the href with the "#" means?
<a id="logoutLink" href="#">Logout</a>
It is the shortest way to say "go nowhere" :)
Often something else is bound to that link, a javascript event handler in most cases. But if an <a> doesn't have a href, most browsers don't render it with the same styling...so you need a short something to put there.
If it had something following the hash, like Go to Topics it is a scroll to link, it goes to where the element with id="topics" is at the top of the page. A common example is Go to Top, and you stick a <div id="top"></div> at the very top of the page.
As others have pointed out, hash anchors (those beginning with the # sign) typically lead to a named anchor on the page. A table of contents on a page might be a good example of where you'd see this:
<ul>
<li>Company History</li>
<li>Our Goals</li>
<li>Products We Offer</li>
<li>Services We Offer</li>
</ul>
<h2><a name="history">History</a></h2>
<p>The #history anchor tag will lead to the named anchor above.</p>
<h2><a name="goals">Our Goals</a></h2>
<p>The #goals anchor tag will lead to the named anchor above.</p>
<h2><a name="products">Products We Offer</a></h2>
<p>The #products anchor tag will lead to the named anchor above.</p>
<h2><a name="services">Services We Offer</a></h2>
<p>The #services anchor tag will lead to the named anchor above.</p>
One thing to note is that when you have a blank hash as the anchor href (i.e.: Blah), some browsers make that jump to the top of the page, which is not the desired effect. To work around this and prevent the page from scrolling all the way to the top, a JavaScript implementation is often included to prevent the anchor tag from acting as it normally would by returning false.
Blah
It means nothing... ;) Normally we use #something to create anchor to some element. If your URL ends with ...#comments then your browser will automatiacly jump (scroll the page) to element with id="comments".
href="#" is often used to create a link that leads to nowhere.
It means make this page an anchor and navigate to it - which is why you see '#' after your URL in the address line (which can have nasty side-effects). Its also why your page will scroll back up to the top if you click on the link (sidenote: you can avoid this by adding "return false;" at the end of your onclick handler)
If points to an anchor on the page. In this case the anchor is just default. You could have multiple anchors on the page
<a name="anchor1"></a>
<a name="anchor2"></a>
<a name="anchor3"></a>
and link to them as
link 1
link 2
link 3
The hash symbol (i.e., <a id="logoutLink" href="#">Logout</a>) is a placeholder, so that you can preview the "Logout" link in a browser as you develop your page. Eventually, the hash symbol will be replaced with a real URL.