So I have two separate HTML files. The first one holds a section with id="portfolio". The second one holds an a href. When I click the a href in the second HTML file I want to go to the first HTML file at the #porfolio section position. I know how to open the first HTML file from the a href. I also know how to get to the #porfolio section from the first HTML file. What I don't know is how can get to the #portfolio section in the first HTML file through the second HTML file. So how can I do that? Thanks in advance!
First HTML:
<section class="no-padding" id="portfolio">
...
</section>
Second HTML:
<a class="page-scroll" href="#portfolio">Portfolio</a>
This should work when included in second.html:
<a class="page-scroll" href="first.html#portfolio">Portfolio</a>
To clarify: you have 2 pages open in a webbrowser (the same webbrowser) and you want to jump back and forth between the 2 different pages, causing the web browser to change tabs/windows and re-display the requested page(s) at the anchor point you specify.
You need to talk to webbrowser and get it to do the work for you. The answer is browser specific.
I would start by creating child page (target='_blank') of original page and seeing what individual browsers allow you to get away with. Your mileage may vary, as they say.
Related
I am playing around with an HTML template. I made a un-ordered list that enables the visitor to choose between two languages. Within it, i placed an anchor tag, and within the tag an image corresponding to chosen language, accompanied by some text. Though i have don't this before, for some reason, when i try to test the page on Firefox or Chrome the anchor tag won't work. Any suggestions? Thank you in advance for your time.
Code:
<div class="polyglot-language-switcher" style="margin-top:10px;float:right;">
<ul>
<li style="display:inline;margin-right:2px;"> English (US)</li>
<li style="display:inline;"><img src="images/gr.png" alt="Greek"> Ελληνικά</li>
</ul>
</div>
EDIT:
I do not know, if this has any value, but i initially copied the code from this site http://www.ixtendo.com/polyglot-language-switcher-2/. But i only copied the HTML bit.
Just Download the Zip file from this link
https://github.com/ixtendo/Polyglot-Language-Switcher/archive/master.zip
and extract it and open the index.html file.... that is what you want.
I am trying to make an href button that when clicked changes the image on my website page to another image. How precisely can I do this?
I am trying to use the following code to point "Page 2" to page 2.html doc in my files as to change the image. The file cannot be found however.
<a href=“<a href=“page 2.html”> Page 2</a>
I do apologize if I am vague/if this question has been answered in past--Stack has been immensely helpful for answering my questions in past but I am just very confused as to how to solve this.
Thank you
correct syntax:
<a href="file" >link to be seen on page </a>
so for you:
Page 2
If the file has a space in it, you should put a %20 where the space is:
href="page%202.html
page 2.html shouldn't contain any spaces. Consider this: Page 2
If this is not still working page 2 , try to input the whole file path. eg. page 2 . You may also refer
here
I've got an un-complicated .aspx page and I've added some bookmark anchors at that re-direct to a different page with bookmarks.
The anchors look like this:
From http://www.davincispainting.com/painting-solutions
<a class="questionLink" href="painting-answers#Answer7">Paint Chalking</a>
When you click on this Hyperlink in Firefox, the URL does indicate the bookmark:
http://www.davincispainting.com/painting-answers#Answer7
However, this do not navigate to the actual bookmark in the 2nd page
<h2 id="answer7">Paint Chalking</h2>
The problem occurs in Firefox but not IE8.
I originally thought that the Routing was causing the issue, as I do not inlcude the .aspx page extension in the link. So I added the extension, which still doesn't work.
<a class="questionLink" href="painting-answers.aspx#Answer7">Paint Chalking</a>
How can I debug this problem?
Does the page file end in an extension? If so, make sure your link includes the extension. Also, check your capitalization. Also, the standard practice for the bookmark syntax is to not navigate based on ID of a random control, but rather the anchor tag. See W3 Schools Example.
You should have...
<a id="answer7" />
<h2>Paint Chalking</h2>
and the link should look like this:
<a class="questionLink" href="PATHTOPAGE#answer7">Paint Chalking</a>
Where PATHTOPAGE is replaced with the absolute or relative path to the other page. Make sure that resolves.
The problem was the name itself:
<h2 id="Answer7" style="font-size:1.5em; color:Green;">Paint Chalking</h2>
is different than:
<h2 id="answer7" style="font-size:1.5em; color:Green;">Paint Chalking</h2>
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