HTML - Links To Move Down Page Sections
Hi all
New to this forum and pretty basic in html But how to i create links at the top of the page to move down the page to certain sections. Regards, Alan Able to handle html sample code Similar TutorialsHow can I place the php form into the html page? Please see the attachment describe what I asking for. thank you. I can't figure out how to script an image so that it slides to another area on the page when clicked on. For example, a logo that appears in the center of a blank page (vertical-align: middle), but when clicked slides smoothly to the top (vertical-align: top). Alternatively, it could be that clicking the image changes the vertical-align property of the entire table or cell. Either way, I can't figure out how to do this with a smooth animation. A fantastic example of this--where I got the idea, in fact--is the front page of tumblr.com, where clicking "Log in" smoothly slides the tumblr logo from the top of the page to the center. How is this done? I'm sorry if the solution is mind-bogglingly simple, I'm kind of a noob. But I've racked the web and I can't seem to find a script that does this. Can somebody please help? Thanks so much. I have the following Web Page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="en-gb" http-equiv="Content-Language" /> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> </head> <body > <div style="margin:auto;text-align:center"> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> </div></body> </html> If I add another DIV with an image inside it, the images all move to the left by 8 to 10 pixels. This is the second version of the page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="en-gb" http-equiv="Content-Language" /> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> </head> <body > <div style="margin:auto;text-align:center"> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> <div><img height="227" src="Images/2010BikeRide_BestTeamRU_360x227.jpg" width="360" /></div> </div></body> </html> I have no idea why the page center moves to the left, but it means that I can't get my page banner to appear the same on every page. (I've stripped out all the extra content and codes to just leave the offending images.) I primarily use Firefox, but the same is happening in IE and Opera. Can anybody tell me what's happening? (I apologise if this is a well known, frequently asked question, but I couldn't find an answer and this is driving me up the wall, so any help is appreciated.) I want my header at top with a logo in a navagation bar at left and the main in the middle, i have this: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <head> <title>Platnium</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> body {background-color: #555555} p {color: #ffffff} div {background-color: #000000} </style> <script type="text/javascript"></script> </head> <body> <div id="wrap"> <div style="text-align: center;" id="header"> <p> Header </p> <div id="left" style="text-align: left;"> <p> left </p> <div id="main" style="text-align: center;"> <p> main </p> </div> </div> </div> </div> </body> </html> But i want them in different sections. like if i was going to put them in tables. Hi all... I hope i can get some help here. I am working with html and a little css. On every page i want such buttons as "Home", "About"... Lets say i have 20 pages and want to add a new button called "Contact" on top of every page. How can i do that in a smart way? Because i dont like to change all twenty pages every time i want to add or delate one of these buttons. I hope you can help I have an <a> tag which when you hover has the background turn grey, but it only highlights the section around the text but I would like it to be a bigger area around it. Like having text centered in a table cell and whe you hover the background turns grey. Any ideas? I have a folder which contains over 1000 songs on my server Artist-Song.mp3 format. I want to create a links page with my own template and such, but not have to sit and copy/paste the urls 1000 times. I need a program or script that would just recognize all the files in that folder so I can make a page to display all the songs. See what I'm saying? Here it is now: http://acidtripmediaproductions.com/lmi/links.html What can I do to it so that it doesnt look so plain? I was going to take banners/logos of the few companies & make them a image with a link to the website, but not all of the websites had a really good image or logo that would work. What other tricks can I try? Dont know if it is the right forum place I have html links on my web site. These links are to files. Recently when i clicked the link, the file "open / Save" dialogue appears, but now i receieve a page can not be displayed. Right click save as works i.E 7, What could be causing this Regards, Alan hi I have a website that created with frontpage and I want to make linkbar like marquee links in left side of page I could make marquee link bar but I want to know if I can make marquee to read links from another page that I could update that page and all marquee in every page automatically updat? Sorry for bad language Thanks for help Nima Hiya, I was wondering if there's a way to make various sections of the image clickable? The sections on the image are not rectangular so I can't make divs. I don't think I can use imagemap either since that only works for making one clickable area right? I already cut out these sections in photoshop and saved them with alpha background, and created a "glowing" version of each section, since I want to make it so that when mouse hovers over it, it will glow. But I can't stack them on top of each other, since if I do that only the topmost layer will be clickable for those areas where they will overlap with rectangular divs. This is example of what I mean: Thanks Hi, Consider the following HTML code: HTML Code: <div style="background-color: blue"> <p> This is a paragraph </p> </div> <div style="background-color: green;"> <p> This is another paragraph </p> </div> The problem is, despite specifying background colors for the div sections, inevitably there's a white space between the two sections. Instead, I want the colored sections to be adjacent to one another, without any space in between, like adjacent cells of a table. I'm trying to be good and avoid using <table>'s as so many tutorials have encouraged, but I'm unsure how to accomplish this without them. I believe this is possible but does anyone know for sure? Thank you! Edit: If it makes a difference, it's sort of a requirement that the content within the div sections will be <p>-enclosed blocks of text. I mean to say that when you make an image and want certain sections of it to link to one page and another section of it to link to another whats the code for this? I've been looking everywhere and can't find it anywhere I am using <a href> classes in a css to change the colors of different types of links in my document. The default a:link is white. I defined another class a.bottomlink:link that is blue. If I use the bottomlink class with a link to a website that looks like this "http://website/subname/" I get a white link. If I use it with a link to a website that looks like "http://website/subname/pagename.asp" I get a blue link. I don't know the pagenames for all the websites I link to. Why is this happening? What can I do? Thanks. Hi, I need a dropdown menu where I can assign a different link to each option (and when the option is chosen that link is opened in the same window), it should be as simple as possible so it works on the majority of browsers and doesn't get blocked by various utilities that block java/scripting and all that stuff... I don't mind if the user has to press a 'submit' button or whatever. What's the best way to do this? Thanks. Hey everyone! Does anybody know how we could set up google search results for this: ( see pic ) Hi, I am trying to figure out how to make my links stay on the left side page while scrolling down or up. Not sure if this is the right place to post. Any help, codes, and/or examples would be great. Thanks not sure if i need a js for this but I have a web page using page jump links to navigate a FAQ page. However, I would rather have a drop down menu/form with the links instead of a list of text links. Anybody have a clue? thanks in advance. This is what I have so far as an example... <form name="jump"><select id="select" name="select"> <option value="" selected="selected">Select</option> <option value="#1">Category 1</option> </select></form> <a id="1" name="1"></a> Category 1 Hey, I'm having a couple of problems which I'm hoping some of you may be able to help me with. Basically the background for the website which I am working on has 3 sections; a top section, a blankl middle section, and a bottom section. I have therefore designed the site using 3 tables, each table containing one row and 3 columns. Each table has one of the backgrounds, such that: A. The background of the top table is the top background. B. The background of the middle table is the blank, plain white background. C. The background of the bottom table is the bottom background. This method seems to work, however when I first implemented this design non of tyhe backgrounds displayed, so to get round this I entered some <br></br> tags which succesfully caused the backgrounds to display suitably. I continues the web design in FF, and completed it. When I then viewed the finished article in IE there were 2 top backgrounds, on middle section, and 2 bottom backgrounds. I fear I may be totally missing the point here! Can anyone help me out please. |