|
HTML - Help With Adding Anchors
I'm trying to add an anchor to my blog, but without having any link to it in the page itself. I just want to be able to have a specific address for the part of the page that I want to jump to, so that I can cite that address in other places.
Is there any way to do this? I tried inserting this in a random part of my page: <a href="#name"></a> And then this immediately above where I want the anchor to be: <A NAME="name"></A> But...going to mywebsite.com#name did not take me to the anchor, it just opened the page like normal. Ideas? Similar TutorialsDisregard this post Hello I am having trouble understanding destination anchors(xhtml transitional) First you do this right: <a name="pagetop"></a> then you do this <a href="#pagetop"> Page top </a> what I dont understand is how you mark the place in the site where you are suppose to jump to. I would like to use anchors to move down a long scrolling section of my page. The idea is like freezing the top of a spread-sheet. The top section is fixed and has a solid background and a high z-index. The bottom is similar to the top section. The middle shows the low z-index section and allows it to scroll. Since the top is currently set to a height of 200px, I need to have my anchors offset by 200px. I have this line of code showing in the top section: <a href="#line1">group 1</a>, <a href="#line2">group 2</a>, <a href="#line3">group 3</a>, <a href="#line4">group 4</a> Down in the code for the middle section I have code that looks like this: <a name="line1" id="line1">Group 1</a> repeated for four groups of text. The problem is that an anchor moves to the top of the browser window which is 200px above the area that is visible. Here are two links http://www.roberson-family.com/testing/scroll_test.html this is showing the problem. http://www.roberson-family.com/testi...ll_test_1.html and this is showing the cause of the problem. You can see that the underlying text aligns to the top of the browser. Surely there is a method to do this, but thus far, Google has failed me, and I find nothing like this here. Hi all, just a tiny little problem here. I've got an index page with roll-over thumbnail jpg pics. I want to link them to another page at the relevant place on the page. Currently I can manage a link to the page (storyboards.html), but I can't get the link to go down the page to the relevant section. (storyboard section2). Help appreciated. It's seems I've come across a problem. When the page loads, I want it to go to the anchor. Do I have to use the "onload" Java command? Arrrg, - Miles I am trying to link to a specific part of a page, the instructions tell me to: Quote: add # along with the destination anchor id to your href This is my href: Quote: Read the <a href="http://buzz.headlabsfirst.com title="Read all about caffeine on the buzz">Caffeine buzz</a> I have added in bold below <a id="#coffee"</a> so my mark up looks like Quote: Read the <a href="http://buzz.headlabsfirst.com <a id="#coffee"</a> title="Read all about caffeine on the buzz">Caffeine buzz</a> but it does not take me directly to the coffee section, what am I doing wrong please? trying to accomplish creating a drop down menu for the anchors of a page. any help or code would be greatly appreciated. any further details needed please dont be shy Example Drop Down-> Products Description->to anchored section. For multiple anchors. Thanks for your time. Hello All, You guys are probably sick of this topic but I'm really stuck. I want the frame page (using horizontal frames) to open my content page part way down an existing HTML document. No Links, just want to open part way down my content page. Here's my Frameset page: <html><head><title>Table</title></head> <FRAMESET Rows="148,100%"> <frame noresize src="table_hdr.html"> <frame src="green.html#greentop" NAME="content"> </FRAMESET> </html> I tried putting the standard anchor tag in my content page, as so: <A name="greentop"> at the location I want the content page to open but no Joy. The content page still opens at the top. Using lE 7 What am I doing wrong and what is the proper tag to open the page where I wish? Thanks all for your help. Charlie I have a page with an i-frame and I know how to open links into i-frames. I also have a anchor at the top of the page and I know how to link to anchors. Is there a way to do both at the same time? The i-frame is at the top of the page. I would like to be able to click a link at the very bottom of the page and be moved to the top *and* have that link opened up in the i-frame. Is there an easy way to do this? Thx. I'm designing a site and have a bunch of targets on one page. I had come across this site (http://www.welcomebrand.co.uk) and while back and liked how when the top links are clicked, instead of shooting straight down to the corresponding content, it was a quick, but smooth scroll. I looked in the code of the site, but couldn't eye out what it was. Any hints? I have a website that has an image that loads at the top of the page, and then text about the image that loads below it. My problem is I placed an anchor by the text, underneath the image, so when a certain link is clicked it skips the image and goes right to the text where the anchor is....but when I click on a link to refer to that anchor, it loads to where the anchor is before the image size (width and height) loads. Then, the image loads, and expands th epage, and the image is on screen instead of the text I anchored to. Is there any easy way to make it so the anchor waits for the image to load before going to where it is....or so the image preloads the size and expands to that width and height before bothering to load the entire image so the anchor will be positioned right....or anything along those lines? To clarify, it looks like this: <p><img src="image location" /></p> Text: <a name="reviews" id="reviews"></a> and then the link : <a href="site.php?cnt=<? echo($cnt); ?>&pg=<? echo($pg - 5); ?>#theanchor"> Prev 5 </a> and the anchor position loads before the image loads, so instead of skipping the picture and displaying the text, it just displays only the bottom 90% of the image or so. Any ideas would be welcomed , --Tony right i have a site which is like a blog the parent page has two iframes on it: one called date and one called blog now the iframe date has different dates in the iframe blog has well the blog with anchors on the dates now i need so that wen you click on a date in iframe date it moves to that anchor in iframe blog which are two completely different pages any help appreciated INDEX (base) <html> <head> <title>site sliced</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <!-- ImageReady Preload Script (site sliced.psd) --> <script type="text/javascript"> <!-- function newImage(arg) { if (document.images) { rslt = new Image(); rslt.src = arg; return rslt; } } function changeImages() { if (document.images && (preloadFlag == true)) { for (var i=0; i<changeImages.arguments.length; i+=2) { document[changeImages.arguments[i]].src = changeImages.arguments[i+1]; } } } var preloadFlag = false; function preloadImages() { if (document.images) { workinp_03_over = newImage("images/workinp_03-over.gif"); workinp_04_over = newImage("images/workinp_04-over.gif"); workinp_05_over = newImage("images/workinp_05-over.gif"); workinp_06_over = newImage("images/workinp_06-over.gif"); preloadFlag = true; } } // --> </script> <!-- End Preload Script --> <style type="text/css"> <!-- .style1 {color: #000000} --> </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" background="images/background.gif" onLoad="preloadImages();"> <!-- ImageReady Slices (site sliced.psd) --> <table id="Table_01" width="800" height="601" border="0" cellpadding="0" cellspacing="0" align="center"> <tr> <td colspan="14"> <img src="images/workinp_01.gif" width="800" height="21" alt=""></td> </tr> <tr> <td colspan="4"> <img src="images/workinp_02.gif" width="93" height="79" alt=""></td> <td colspan="2"> <a href="link1.html" onmouseover="changeImages('workinp_03', 'images/workinp_03-over.gif'); return true;" onmouseout="changeImages('workinp_03', 'images/workinp_03.gif'); return true;" onmousedown="changeImages('workinp_03', 'images/workinp_03-over.gif'); return true;" onmouseup="changeImages('workinp_03', 'images/workinp_03-over.gif'); return true;"> <img name="workinp_03" src="images/workinp_03.gif" width="132" height="79" border="0" alt="link1"></a></td> <td> <a href="link2.html" onmouseover="changeImages('workinp_04', 'images/workinp_04-over.gif'); return true;" onmouseout="changeImages('workinp_04', 'images/workinp_04.gif'); return true;" onmousedown="changeImages('workinp_04', 'images/workinp_04-over.gif'); return true;" onmouseup="changeImages('workinp_04', 'images/workinp_04-over.gif'); return true;"> <img name="workinp_04" src="images/workinp_04.gif" width="138" height="79" border="0" alt="link2"></a></td> <td colspan="2"> <a href="link3.html" onmouseover="changeImages('workinp_05', 'images/workinp_05-over.gif'); return true;" onmouseout="changeImages('workinp_05', 'images/workinp_05.gif'); return true;" onmousedown="changeImages('workinp_05', 'images/workinp_05-over.gif'); return true;" onmouseup="changeImages('workinp_05', 'images/workinp_05-over.gif'); return true;"> <img name="workinp_05" src="images/workinp_05.gif" width="162" height="79" border="0" alt="link3"></a></td> <td colspan="2"> <a href="link4.html" onmouseover="changeImages('workinp_06', 'images/workinp_06-over.gif'); return true;" onmouseout="changeImages('workinp_06', 'images/workinp_06.gif'); return true;" onmousedown="changeImages('workinp_06', 'images/workinp_06-over.gif'); return true;" onmouseup="changeImages('workinp_06', 'images/workinp_06-over.gif'); return true;"> <img name="workinp_06" src="images/workinp_06.gif" width="161" height="79" border="0" alt="link4"></a></td> <td colspan="3"> <img src="images/workinp_07.gif" width="114" height="79" alt=""></td> </tr> <tr> <td> <img src="images/workinp_08.gif" width="39" height="38" alt=""></td> <td colspan="2" rowspan="2"> <img src="images/workinp_09.gif" width="45" height="340" alt=""></td> <td colspan="9"> <img src="images/workinp_10.gif" width="624" height="38" alt=""></td> <td rowspan="2"> <img src="images/workinp_11.gif" width="50" height="340" alt=""></td> <td> <img src="images/workinp_12.gif" width="42" height="38" alt=""></td> </tr> <tr> <td> <img src="images/workinp_13.gif" width="39" height="302" alt=""></td> <td colspan="5" BACKGROUND="images/workinp_14.gif" width="329" height="302"> <iframe name="IF" id="IF" src="dates.html" height="100%" width="100%" frameborder="0">your browser doesnt support iframes please update it</iframe></td> <td colspan="4" BACKGROUND="images/workinp_15.gif" width="295" height="302" valign="top" style="padding-left: 25px"> <font color="white">HI HOW ARE YOU<P> this box doesnt extend and i cant make it so dont put too much here as it looks really screwy,<P> <B>but look at the background its acctually really smoothly animated and fades so it doesnt annoy you</B></font></td> <td> <img src="images/workinp_16.gif" width="42" height="302" alt=""></td> </tr> <tr> <td colspan="14" BACKGROUND="images/workinp_17.gif" width="800" style="padding-left: 100px; padding-right: 100px"><BR> <iframe src="blog.html" name="IF2" width="100%" height="100%" frameborder="0" class="style1" id="IF2">your browser doesnt support iframes please update it</iframe></td> </tr> <tr> <td colspan="14"> <img src="images/workinp_18.gif" width="800" height="107" alt=""></td> </tr> <tr> <td colspan="14"> <img src="images/workinp_19.gif" width="800" height="22" alt=""></td> </tr> <tr> <td colspan="14" BACKGROUND="images/mid_b.gif" width="800" style="padding-left: 105px; padding-right: 105px"><font color="white">and sodoesn this one <P> its great</font></td> </tr> <tr> <td colspan="2"> <img src="images/workinp_20.gif" width="75" height="17" alt=""></td> <td colspan="3"> <img src="images/workinp_21.gif" width="46" height="17" alt=""></td> <td colspan="5" rowspan="2"> <img src="images/workinp_22.gif" width="514" height="18" alt=""></td> <td colspan="2" rowspan="2"> <img src="images/workinp_23.gif" width="73" height="18" alt=""></td> <td colspan="2" rowspan="2"> <img src="images/workinp_24.gif" width="92" height="18" alt=""></td> </tr> <tr> <td colspan="5"> <img src="images/workinp_25.gif" width="121" height="1" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="39" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="36" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="9" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="9" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="28" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="104" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="138" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="50" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="112" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="110" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="51" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="22" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="50" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="42" height="1" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> <br> </body> </html> DATES: <html> <head> <title>doesnt matter</title> </head> <body bgcolor="black"> click a date to go to that date <a href"blog.html#10807 target="IF2">August 10th 2007</a></center> </font></body> </html> BLOG: <html> <head> <title>doesnt matter</title> <link href="blog.css" rel="stylesheet" type="text/css"> </head> <body bgcolor="black"> <table width="100%" border="3" align="center" cellpadding="5" cellspacing="5" bordercolor="#999999"> <tr> <td class="date" width="30%"><a name="10807">10th august 2007</a></td> <td class="main" width="100%">Hi my name is Matthew Hailwood and i decided to start a blog to keep track of my life, i dont know how often i will update this however I will try my best </td> </tr> <tr class="main"> <td class="date">10th august 2007 </td> <td>this is the second post </td> </tr> <tr class="main"> <td class="date">10th august 2007 </td> <td>this is the third post </td> </tr> </table> </body> </html> I don't have the ability to add an anchor to the page, it's not mine, but I'd like to link to a specific area on the page. Is that possible without that page having some sort of anchor already on it? Ok Say I Have One Text That Ses 1.5 And I Want To Add 0.5 To IT The Answere Would Be 2.0 Can Javascript Do That Properly I Dont Need To Know How To Do It I Can Manage Just Querious If It Will Add Fractions Before I Start Working On It? Hi guys, I know scroll-bars are automatic when your page gets longer than the screen. I have recently developed a new webpage, and on some pages your required to scroll down, on others you aren't. How do I leave the right hand scroll bar there even if its not required (greyed out) This way my site doesn't seem out of line as they navigate through it. hey can someone please help i am having trouble with adding a banner when i just to add it the picture does not show what could i be doing wrong??? Is it possible to add a poll to a html or php site? Hi there.. i added some menu buttons for my site this is the code for the menu button <BUTTON TYPE=SUBMIT> <IMG SRC="../graphics/sfsmile.gif" HEIGHT=97 WIDTH=105 ALT="Starflower" ALIGN="ABSMIDDLE"> <STRONG>Send It In!</STRONG></BUTTON> Or go here i took this code from this website http://www.htmlcodetutorial.com/forms/_BUTTON.html you have an example here Now i added them but i have no clue how to add a link to this button so that when i click on it sents me to a page.. any ideeas pls ? Can anyone help me so that i can add a link to this menu button ? Thx Hi All, After hours of searching, I have yet to find a solution to my problem so I am turning to you all for advice. Here is what I am trying to accomplish - I would like to add an event to a <DIV> to make the background image change when the user mouses over the <DIV>. Further, I would like to turn the entire <DIV> into an <A>, so that no matter where the user clicks in the <DIV> they will be taken to a new page. The two obstacles I am running into are semantics and support. Simply wrapping the <DIV> in an <A> tag does not work because the browser does not interpret <A> as a containing element. Inserting the <A> inside the <DIV> I run into the same problem - the <A> just sits at the top of the page and does not contain anything. As for the event - :hover would suffice if IE5 & 6 supported it for <DIV>, but as we all know this is not the case. Since 60% of users are still running this [expletive] browser, I need to find a workaround. My guess is that there is JavaScript somewhere that will solve my problem - but I have not found anything yet. Can anyone direct me to an article or other resource that offers some info on the aforementioned? Or has anyone done this themselves that can offer a few pointers? Thanks in advance! Does anyone know how to add a favicon to each of a site's pages using the CSS Style sheet as apposed to putting the code on each page? |
|||||||