HTML - Overcome Problem With Anchor Links...
Hi all,
I was wondering if anyone knows how you can force a page to automatically jump to an anchor link on that page...for example so the visitor doesn't have to scroll down everytime. I know I can just put: <a href="http://www.site.com/about.htm#anchor"></a> in the links etc...but is there a way to force a page to jump to the anchor without putting it in the links? Thanks ~Paul (ps. The reason is because my blog is a whole screen down on most screens, so when someone click on an archive etc...they have to scroll down over and over) Similar TutorialsUsing help from (http://www.echoecho.com/htmllinks08.htm) I added links to my page (http://laititudefestival.zxq.net/whosplaying.html) When clicked on the title 'Lake Stage' it should redirect you to the line up image lower down in the page. The link (http://laititudefestival.zxq.net/whosplaying.html#lake) appears in the address bar . It should move the page down but it dosent Please help Just give me one working example I would be very happy I could change text and so on ! Thanks , Sorry for English Hi, I've got a page with links to anchor points but clicking on it makes the popup open in a new window which I don't want to do, I just want it to snap to the anchor on the page. I've tried a few types... <li><a href="#faq_101605">What sort of feedback do you get from other advertisers?</a> </li> <p><a name="faq_101605" title="faq_101605"></a></p> ...and... <li><a href="http://dev.mysite.com.au/advertise/advertisers-faq.htm#faq_101498">How long will my advert stay on your web site?</a> </li> <p><a name="faq_101498" title="faq_101498"></a> Any help would be great. Thanks This problem is simple in need, but a little complex to explain. What I am looking for is a way to create a flowchart or a sitemap of each HTML file rather than my whole site. I need a program or application that will do this for me automatically instead of having to create this manually. I have all ready tried Visio, but it does not do what I desire. Specifically, I have multiple anchor links within each HTML file. These anchor links point to other 'panels' on my page. Within those 'panels' might exist additional links - external or internal. At some point, those links will end at a 'panel'. I need a way to visually show where each anchor link is going, where those links came from (which panel they originated from), and if any of them are 'broken'. I have attached two files that may explain this better. The flowchart_example.jpg shows exactly what I require (more or less). I really just need the boxes (labeled Panel 00, Panel 01, etc.), how each connects to the other based off of links that are in the HTML file, and eventually show where the links end (no more links in the panel). I do not need the '1 Click' or '2 Clicks' to show up. Those can be manually added later. The an_example.html file shows an HTML file that has the anchor links and external links that would need to show up in the flowchart. This HTML file more or less mirrors what I am looking for in the flowchart_example.jpg file. When I refer to Panel 00, that is the top of the page, after the title and black line (where the script actually begins). The user must start at the top. They cannot skip around to other panels. This is why a visual flowchart would be quite helpful. Additionally, the links at the top (scripts, reference, transfers, etc.) along with the top and back buttons on each panel should be ignored when creating the flowchart. Any information or assistance in finding an application or a way to accomplish this would be greatly appreciated. Thanks in advance. Hi everybody, im new here. i've done lot of search and nothing solved my problem. here is my situation. I have 2 pages, in the first page i want to make a link to the second page but at a specific point in the second page. Here is my code: in the first page, i make this link: <a href="page2.html#70" class="Style1">linktopage2 (1)</a> in the second page at the point i want to link: <a name="70"></a> Did i forget something? right now when i click the link in the first page, it open the second but at the top of it and not at the point i want. someone have a better way to do what i want? thank you all!! mike I am having a problem with my anchor links disappearing when I click on one. I don't know what is causing this to happen. Here is the link to the problem. When you click any of the links, it takes you to the right place. But scroll back up and you will see that 2 of them disappear. http://www.white-candle.net/Our-Other-Products.html Relevant Code: HTML Code: <CENTER><p> <a href="#bathnbody">Natural Bath And Body Products</a><br> <a href="#cosmetics">Natural Cosmetics</a><br> <a href="#skincare">Natural Skin Care</a></p></CENTER> and the anchor names: HTML Code: <a name="bathnbody"><hr></a> <a name="cosmetics"><hr></a> <a name="skincare"><hr></a> Hi im getting reports of a strange problem occuring on a link to an email address when some users click the link below and the defailt email client is opened the email is appearing with capitals and then when sent, does not apppear in the inbox. surely theere is no way to do this besides javacript or the below? HTML Code: <p><a href="mailto:bookings@hjkjjhgkj">bookings@hjkjhkhjkhjk</a></p> </div> </div> does the problem lie with the the eamil cinent? Hi everybody.A few days ago I started learning HTML.(So ,i am a noob.)When I read about destination anchors,instantly I put one in my test page.But there is a problem. Here's the code HTML Code: <! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html/> <head> <title>Bizone Webdesign</title> <meta http-equiv="Content-type" content="text/html" charset="windows-1250"> <meta name="keywords" content="bizonethemighty, web, design"> <meta name="description" content="Aceasta pagina ofera informatii despre studio-ul BizoneWebDesign"> </head> <body bgcolor="white" background="bkg.jpg" text="333333" link="333333" alink="ff6600" vlink="ff6600" > <DIV align="center"> <H1><a name="sus">webDesign studio <Q lang="en">Bizone</Q></a></H1> <H2>Test page</H2> </DIV> <p>Studio <ABBR title="Desing in domeniul Web">webDesign</ABBR> are o echipa de <STRONG>profesionisti</STRONG>,gata sa va satisfaca cerintele in domeniu.La fel cum H<sub>2</sub>O este prezenta oriunde pe planeta,iar ecuatii simple ca x<sup>2</sup>+y<sup>2</sup>=0 caracterizeaza algebra,la fel calitatea proiectelor noastre este evidenta si le caracterizeaza.</P> <P>Propunem o gama <EM>larga</EM> de <a href="portofoliu.html">proiecte</a>,realizate la cel mai inalt nivel</P> <PRE align="center"> Orase in care avem oficii: </PRE> <DIV title="Locatia orasului pe harta"> <PRE align="center"> <a target="_blank" href="http://maps.google.com/maps?oe=UTF-8&gfns=1&q=chisinau&um=1&ie=UTF-8&hq=&hnear=Chisinau,+Moldova&ei=MsdOTLGkC5-VOP-P-OMC&sa=X&oi=geocode_result&ct=title&resnum=1&ved=0CCIQ8gEwAA">Chisinau</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=balti&sll=47.216667,29.166667&sspn=0.165801,0.308647&ie=UTF8&hq=&hnear=Balti,+Moldova&z=12">Balti</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=edinet&sll=47.026859,28.841551&sspn=0.332785,0.617294&ie=UTF8&hq=&hnear=Edinet,+Moldova&z=12">Edinet</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Cimi%C5%9Flia,+Moldova&sll=47.75494,27.913&sspn=0.16411,0.308647&ie=UTF8&hq=&hnear=Cimi%C5%9Flia,+Moldova&z=11">Cimislia</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=causeni&sll=48.166667,27.316667&sspn=0.162807,0.308647&ie=UTF8&hq=&hnear=Causeni,+Moldova&z=12">Causeni</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Straseni,+Moldova&sll=46.516667,28.783333&sspn=0.335953,0.617294&ie=UTF8&hq=&hnear=Straseni,+Moldova&z=12">Straseni</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Criuleni,+Moldova&sll=46.6418,29.40942&sspn=0.16759,0.308647&ie=UTF8&hq=&hnear=Criuleni,+Moldova&z=12">Criuleni</a> <a target="_blank" href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Soroca,+Moldova&sll=47.14204,28.61837&sspn=0.166034,0.308647&ie=UTF8&hq=&hnear=Soroca,+Moldova&z=12">Soroca</a> </DIV> </PRE> Logo-ul Studio-ului nostru:<IMG src="images/blazon_small.jpg /><BR> <a href="index.html#sus">Inceputul</a> </body> </html> The problem is that the last image HTML Code: <IMG src="images/blazon_small.jpg /> won't work until I remove the destination anchor HTML Code: <a href="index.html#sus">Inceputul</a> which doesn't work too if there is the img tag too. Please,tell me,what's the problem?These things can't work together?Please help! Hey guys I am creating this website http://www.upfrontdesigns.co.uk/build/services.html but when you click on the click here for more info click it more down to the correct section but the header disappears in firefox. Its ok in IE tho Any Ideas? Ok i have just started an html tutorial and stumbled accross a brick wall. Its about the links. Every time i click on the links it says File not found. My html code is separated in three .html documents all located in the same folder... The code i am using to add the links is: <div id="navigation"> <ul> <li><a href="index.html">Home</a></li> <li><a href="about.html">About Us</a></li> <li><a href="contact.html">Contact Us</a></li> </ul> </div> Is it this code or? Btw my .html documents are named just like the above code says: index.html, about.html and contact.html. So i dont think that could be the problem... Please help! I made a link in the middle of a paragraph and now the text that follows the links is activated and appears red when I roll over it (as do my links). I thought I ended the links properly but perhaps not. Any advice? Xhtml code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>About</title> <link rel="stylesheet" type="text/css" href="../style.css" /> <meta name="generator" content="BBEdit 8.6" /> </head> <body> <div id="wrap"> <div id="header"> <p id="navbuttons"> <a href="../index.html">home</a> <a href="artists.html">artists</a> <a href="writing.html">writing</a> <a href="about.html"class="current">about</a> <a href="links.html">links</a> <a href="contact.html">contact</a> <a href="listings_news.html">news+listings</a> </div> <!-- end #header --> <div id="main"> <div class="about"> <p>Gray Art seeks to promote an active discussion about contemporary art. We are interested in up and coming artists who are do not yet have representation, and we will feature a new artist every two weeks on our <a href="artists.html"> ARTISTS<a/> page. We like art that is fun, offensive, loud, political and bold and are open to any and all media. Writers and critics (professional or not) are encouraged to submit essays, reviews and rants to be posted in the WRITING section. </p> <br> </div> <!-- end .about --> <div class="about2"> <p> If you would like your art to be featured on our artists page, please send several images as well as a brief description of yourself and your work to artists@grayart.com. If you want to write for Gray Art, please send an a brief description of what you want to write about to writing@grayart.com.</p> </div> <!-- end .about2 --> </div> <!-- end #main --> </div> <!-- end #wrap --> </body> </html> __________ CSS code: /* alignment ------------- */ body {margin:0;padding:0;} #header {position:relative; top:-2.7em;} #wrap {max-width: 900px; min-width: 480px; background:url(header_graphic.jpg) no-repeat; width:90%; margin:20px auto; padding:30px 20px 0 0; } #navbuttons {position:relative;top:2.5em;left:14em} /* index ------------- */ .upnow h1 {margin-left:100px; margin-top:70px;} .table p {margin-left:135px; margin-top:25px;} .photo img {left:7empx;position:relative; margin:20px;margin-top:0px;} .photo img {border:none;} /* artists ------------- */ #sidebar {position:relative;margin-left:75%;width:20%;background:red;padding:4px;align:top; border: 2px dashed black;} .feature h1 {margin-left:100px;margin-top:70px;} /* writing ------------- */ .new h1 {position:relative;margin-top:50px;margin-left:100px;} .essays {position:relative;margin-top:30px;margin-left:100px;} .reviews {position:relative;margin-top:2em;margin-left:100px;} /* about ------------- */ .about p {position:relative;margin-top:100px;margin-left:100px;width:500px;} .about2 p {position:relative;margin-left:100px;width:500px;} /* links ------------- */ .links {text-align:center;margin-left:190px;margin-top:100px;postion:relative;} /* text styles ------------- */ #navbuttons {font-family: "Futura", sans-serif; font-weight:lighter;right:-6em;font-size:14px;color:black;text-transform:uppercase;word-spacing:25px} a:link {color:black;} a:visited {color:black;} a:active, a:focus, a:hover {color:red;} a {text-decoration:none;color:black;hover:none} a:hover.current {color:gray;cursor:default} /* index ------------- */ .upnow h1 {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;text-transform:uppercase;} .table p {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px; white-space:non-wrapping;} /* artists ------------- */ .feature h1 {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;text-transform:uppercase;} /* writing ------------- */ .new h1 {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 18px;text-transform:uppercase;} .essays h1 {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;text-transform:uppercase;} .essays p {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;} .reviews h1 {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;text-transform:uppercase;} /* iframe ------------- */ iframe { position: absolute; left: 60%; top: 10em; width: 200px; scrollbar-face-color:##FFFFFF; scrollbar-shadow-color:#d7d7d7; scrollbar-highlight-color:#d7d7d7; scrollbar-3dlight-color:#d7d7d7; Scrollbar-Darkshadow-Color:#d7d7d7; scrollbar-arrow-color:#7a7a7a; scrollbar-track-color:#FFFFFF; } /* about ------------- */ .about p {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;} .about2 p {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;} /* links ------------- */ .links h1, h2 {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 16px;text-transform:uppercase;} .links p {font-family: "Futura", sans-serif;font-weight:lighter;font-size: 14px;} Hey guys, I'm having crap luck with something I'm trying. A little experiment if you will. So heres the deal, basically I took some footer links on a site that I'm redesigning for a lady. (Also with that said ignore all the other code that you see on the page its work in progress, I'm basically taking old html/tables redoing it into xhtml/divs). So my problem is if you see the footer links at the bottom of the page first look at them in FF, basically what I did was removed the line under the anchor and I added a nifty little border-bottom instead. Code: #footer-links a:link { color: #808080; text-decoration: none; border-bottom: thin dotted #808080; } #footer-links a:visited { color: #808080; text-decoration: none; border-bottom: thin dotted #808080; } #footer-links a:hover { color: #808080; text-decoration: none; border-bottom: thin dotted #f1037f; } Problem is IE will not show this correctly. So I assume it doesn't like the way I did the border-bottom. So I figured ok thats fine in IE I'll just show it normally. So back in my markup I added this to fix it. Code: <link type="text/css" rel="stylesheet" href="style.css" /> <style> <!--[if IE ]> #footer-links a:link { color: #808080; text-decoration: underline; } <![endif ]--> <!--[if IE]> #footer-links a:visited { color: #808080; text-decoration: underline; } <![endif]--> <!--[if IE] > #footer-links a:hover { color: #f1037f; text-decoration: underline; } <![endif]--> </style> I even put this under the link to the style sheet so it would override. Its not working though. Please look and help if you all can. http://www.atlanta-web.com/acm/index.html Thanks, Eric I use Blogger but my template is in the classic format so it's HTML not XML and i have a "homepage" sort of thing when you first enter with links to entries, affiliates etc. The problem with my archives is that when someone clicks on a certain month, e.g. January 2010, it jumps back to the "homepage" and you have to click on entries again to view posts from January 2010. Is there any way to fix this? Thanks in advance for any help. Hi guys, I am really new to this. Currently designing a site for an engineering firm and have come up against a slight problem. I am designing a table with links to the other pages, when any part of the cell is mousedover the text colour and background image are supposed to change and then revert back to the original when mousedout, thats no problem, but when I add the link in the whole thing goes to pieces. The background image changes but the text colour doesnt, as can be seen from the "relocation" link on the webpage. You can view the page here http://www.omdtestdomain2.co.uk/?id=93637&option=1485 Any help would be greatly appreciated. Thanks Simon Hello all, thought maybe someone could help me with a basic problem I'm having. I am fairly new to html and stuff but am off to a start to get a site running. The problem I am having is that the image i am using to link is offset vertically with vspace = 11 in order to line up lines with a border type thing. However, when you click the image link it includes the 11 pixels underneath it from vspace as part of the clickable link. Is there a way to make it so that only the image itself is a link and still add the 11 pixel spacing under it to get the image to line up with the rest of the site? Thanks! Code: <img style="width: 51px; height: 57px;" alt=" " src="images/icon/left.bmp"><a href="main.html"><img style="border: 0px solid; width: 92px; height: 30px;" alt=" " src="images/icon/bt1.bmp" vspace="11"></a> Code is just the part of the 2 images: the first image, and the linked image that I want to line up with the first image. Hey guys, Okay so here is what I am trying to do. I am populating a table with some info from a database. The data should look something like this. Recipe Name - Prep Time - Total Time- Rating ============================ test data here 12 mins 15 mins 4.5 test data here 12 mins 15 mins 4.5 test data here 12 mins 15 mins 4.5 test data here 12 mins 15 mins 4.5 The names of the recipe is what I want to create as links so that when the user clicks on a certain RECIPE NAME another page will open showing only the data that goes with that recipe he/she clicked on. So far I have not gotten my code to work correctly, i dunno if i am missing something or doing it all wrong? I am using a while loop to generate all the recipes form the database. Again, i want the names of the recipes to be the links. Please help me!!!! Thanks for your time and help Here is my code: <? while( $row = mysql_fetch_array( $result ) ) { ?> <tr> <a href="ShowRecipe.php?id=<?=$row['id']?>"></a> <td><?=$row['name']?></td> <td><?=$row['preptime']?> mins</td> <td><?=$row['totaltime']?> mins</td> <td><?=$row['rating']?></td> </tr> <? } ?> My fault, the padding pushed the div outward covering the links at the bottom. Hi everyone, I hope I have posted this in the right area. This is my first time posting here. I currently have my main pages listed at the top of my site as graphics (see fussybaby.ca). I would like to potentially remove these graphics and use text links instead - I had the graphics designed for me, so I can't just go in and make new ones, however I'd like to change/rearrange the links and add some new ones. So my question is: How hard is this to do? Is this something I need to hire someone to do for me? Thanks in advance for any advice! Is there anyway to do a sort of "go to next anchor" link? ... and previous anchor? Hey guys, I'm really new to HTML coding so be nice. I'm trying create an anchor on a new page. Is this possible, I can create an anchor that jumps down a page, but I can't get it to work on a different page. I thought I had it, but it only worked in Safari, and wouldn't work in Firefox or IE. Any help would be greatly appreciated |