HTML - Dynamic "next Page" Links?
Let me see if I can explain this correctly:
What I want to do is place all of my pages in a single external file (so that as I add pages, I only have to add that link to one file). Then, place links on each page for "Previous" and "Next". When "Next" is clicked, the next file in the list is linked and likewise with "Previous". As it stands, the only way I see to use "Previous" and "Next" is to hard code the links in each page. But that will become a pain since my pages are in alphabetical order and I would have to redo dozens (or more) pages each time I add a new page. Thanks in advance... Similar TutorialsA customer gave me a Word doc that they want turned into a printer friendly web page. I understand that there are tons of ways to do this but I really want the answer to the subject. What i'm referring to is a form that someone can print from the browser and "fill in the blanks" on the page where there are "underscores". My question is how to code those underscores. I tried manipulating the <hr> tag but it's putting way too much space in between each <hr>. I've already coded a "fill in the blank" line using <u> nbsp;</u> but that looks very messy. What do you guys/gals think? Hello, I want to load a page in a iframe, and when i do this, i want that page to be displayed not at the begining of that page, i want that page to be displayed at a "x" and "y" position specificated by me. How can i do that? Thank you. *please bear with me this is a simple problem which is sort of hard to explain* I run a very small (15 page) website for myself. The site consists of an image_list page, which is an index of 13 thumbnail images. Each thumbnail links to a single page, each page being a larger image of the respective thumbnail. These 13 individual pages are directed at the same base target window, _ximage. you can find the image_list window he http://www.winslowsmith.com/work/index.html click on any one of these thumbnail links and a new window (_ximage) will open. navigate back to the image_list and click another link, the _ximage window will reload with the new page. Pretty simple, right?, just a <base target=""> command. In safari this all looks swell, and the _ximage window, whether open or not, will always come to the foreground to load. Not the case in Firefox. My problem in Firefox is as follows: opening one of the given links in image_list will load a new window (or tab), with _ximage target, and the first time, that new window/tab with _ximage target will come to focus and be in the foreground. However, if the viewer leaves the _ximage window open, and navigates back to the image_list window and clicks another link, that link will load appropriately but the _ximage window will remain in the background. (and it works the same whether you are using windows or tabs to load your new pages). This is frustrating because it forces the viewer to click twice rather than just once to get to one of these 13 pages, and said pages are the reason people would traffic to the site. Is there any way to have the links to base (_ximage) target always load in the foreground in Firefox(even when the target window _ximage is open)? Is there code to tell the Firefox browser, hey this is an important window load it in the foreground? Is there a way to do it with anchors? any help is appreciated Hello, I'm using this tutorial on creating an ipod-esque "cover flow" photo album for a presentation I'm putting together: http://www.elated.com/articles/cover...ss-and-jquery/ What I'm trying to figure out is how do I make each image a clickable link that will open a url in a new window. I know the code is Code: <a href="URL" target="_blank"</a> but I have no idea where to begin and end the tags. I either need it where I can click on each picture, or the text under each picture so that each one has a separate URL that opens in a new window. thanks Hi Folks, I've got my form dynamically generating text fields (which are contained in a form which is in another) and other objects and now I want to give them the "onchange" attribute. I have a lot of code so I'll keep it as small as possible. Here is the function that generates text fields function createText( inputForm, txtName, txtValue, txtWidth ) { var newTxt = document.createElement( "INPUT" ); inputForm.appendChild( newTxt ); newTxt.name = txtName; newTxt.setAttribute( "STYLE", "position:relative; left:20px; width:" + txtWidth + "px;"); newTxt.type = "TEXT"; newTxt.value = txtValue; newTxt.id = txtName; newTxt.onchange = "some_function( this.value )"; return newTxt; } The function for responsible for creating the form is: function createNewForm() { // Main form is a global reference to the main body mainForm = document.getElementById( "adminForm" ); var profileForm = document.createElement( "FORM" ); mainForm.appendChild( profileForm ); profileForm.method = "POST"; profileForm.name = "Profile"; profileForm.id = "ProfileForm"; return profileForm; } This function calls the profile creation form and specifies the objects that will appear on the form. function profileForm() { // Delete and reassign current form if( currentForm != "") deleteForm( currentForm ); currentForm = "ProfileForm"; var newProForm = createNewMenuForm(); newProForm ( menuForm, "Item1", "data1", 140 ); newProForm ( menuForm, "Item2", "data2", 140 ); newProForm ( menuForm, "Item3", "data3i", 140); return newProForm; } I've seen examples of objects being created by JavaScript and they work just fine. Anyone have any suggestions or have an idea where I can find some more info? Thanks! Hey Guys, I know XHTML pretty good, but have recently been trying my hand with Dreamweaver to bang out some websites for other people. I need to know how I can take a basic link, for example... [<a href="http://www.kilroymusic.com/press.htm>] and have it appear without a line under it? I know how to change the link color, and the visited link color. But there doesn't seem to be an intuitive way in Dreamweaver to get rid of the line. Hopefully I have made what I am talking about clear. I don't care if you tell me how to do it in Dreamweaver or manually with code. This is just killing me. Thanks guys! Kilroy http://www.colletts.co.uk/winter_dolomites.htm I have the above page that redirects users to my Winter Website - the HTML below isn't valid W3C does anyone know of a better and valid way to get this done? Cheers, Mas HTML Code: <META HTTP-EQUIV="Refresh" CONTENT="2.5;URL=http://www.colletts.co.uk/winter/winter_dolomites.html" /> I was hoping someone could clue me in as to whether or not this would be possible. I'm thinking it isn't but I need to make sure. I'd like to provide a file for people to download on my website, but when they click on the link and the download window appears I don't want them to have the option of opening it. Is it possible to only give them the option to save the file? Sounds incredibly unlikely but I gotta know. Hey all, So my boss has asked me to consolidate a whole bunch of HTML pages into one jsp page, and I'm having some trouble with the links. Basically the plan is to link to the same page while setting the "location" variable on the server to something else, so the jsp page can check the location variable and make the page accordingly. However, I don't want to just append the the location variable to the url, because its kind of ugly, so I would prefer if there was a way for the links to send a location string using a POST method. I could then use a getParameter call on the server to get the location, and the jsp page could adjust accordingly. Is this possible? Or will I be stuck linking back to the same page but with "?location=index" added to the url? Thanks beforehand. Cheers, Lukas I couldn't find any older threads about this. On internal links it's definitely a no-no, but on external links I think it's up to the webdesigner to choose. What do you think? hi, i am working on <div> i have to hide some part of the table. I am not able to hide that table part can anybady tell me where is the error. Code: <html> <head> <script type="text/javascript"> function callme(){ document.getElementById("hid").style.visibility="visible"; } function hideme(){ document.getElementById("hid").style.visibility="hidden"; } </script> </head> <body> <form name="myform"> <table width="100%" border="4" cellpadding="2" cellspacing="2"> <tr> <td class="tableheader" colspan="9">TS </td> </tr> <div style="visibility:hidden" id="hid"> <tr> <td width="17%" class="labeltext">Tran Code</td> <td width="1%" class="blanktext">:</td> <td colspan="4" class="blanktext">Name</td> </tr> <tr> <td width="17%" class="labeltext">Product Type</td> <td width="1%" class="blanktext">:</td> <td colspan="4" class="blanktext"> </td> </tr> </div> <tr> <td> </td> </tr> </table> <input type="button" onclick="callme()" value="show"> <input type="button" onclick="hideme()" value="hide"> </form> </body> </html> thx in Adv, Hanm. Hi, here is my problem... I need to know how to make a link to a specal section of another page. For example: "Browse by artist - A B C D E F G ect..." I want to have all of the letters be a link to the "list of artists" page but I need them to lead the user to that section whether it be the "A", "M" or "Z" section. Hope you can help, until then i be answering as many of your questions as I can. Thanks! Howdy all, I've noticed when you use rel="" in an a tag, that the link, becomes void, it does not redirect you when you click on it. What can i do to get around this? Thank you, Jared Hi all, I am currently working on a website using Dreamweaver CS3. Whenever I view the (currently very basic) site in Firefox I get the line of code I entered as the title of this thread at the top of the page (directly above the banner) as if I had just typed it into the canvas area (correct term?). Whenever I view it in IE it appears just fine, not sure about other browsers though. I began by creating a template and adding it to the page you see he HTML Code: http://www.geocities.com/makotronic/indexx.htm Here is the code for the template: Code: <%@LANGUAGE="JAVASCRIPT" CODEPAGE="65001"%> <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- TemplateBeginEditable name="doctitle" --> <title>Template for Parish Website</title> <!-- TemplateEndEditable --> <!-- TemplateBeginEditable name="head" --> <!-- TemplateEndEditable --> <style type="text/css"> <!-- body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } body,td,th { font-family: Arial Narrow, Verdana, Arial, sans-serif; } .style5 {font-size: 14px} --> </style></head> <body> <table width="750" border="0" cellspacing="0" cellpadding="0"> <tr> <td colspan="2"><img src="../Images/welcomebanner.gif" width="750" height="125" /></td> </tr> <tr> <td width="160"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> </table></td> <td width="590" align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> <tr> <td valign="top"><!-- TemplateBeginEditable name="Main Body" -->Main Body<!-- TemplateEndEditable --></td> </tr> </table></td> </tr> </table> </body> </html> And for indexx.htm (I added a second 'x' because I already had a 'index.htm' file in GeoCities): Code: <%@LANGUAGE="JAVASCRIPT" CODEPAGE="65001"%> <!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"><!-- InstanceBegin template="/Templates/template.dwt.asp" codeOutsideHTMLIsLocked="false" --> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- InstanceBeginEditable name="doctitle" --> <title>Welcome to the Greencastle Parish Website</title> <!-- InstanceEndEditable --> <!-- InstanceBeginEditable name="head" --> <style type="text/css"> <!-- .style8 { font-size: 36px; font-weight: bold; } --> </style> <!-- InstanceEndEditable --> <style type="text/css"> <!-- body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } body,td,th { font-family: Arial Narrow, Verdana, Arial, sans-serif; } .style5 {font-size: 14px} --> </style></head> <body> <table width="750" border="0" cellspacing="0" cellpadding="0"> <tr> <td colspan="2"><img src="Images/welcomebanner.gif" width="750" height="125" /></td> </tr> <tr> <td width="160"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> </table></td> <td width="590" align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> <tr> <td><!-- InstanceBeginEditable name="Main Body" --> <span class="style8">Header</span> <p class="style3">Main Body</p> <!-- InstanceEndEditable --></td> </tr> </table></td> </tr> </table> </body> <!-- InstanceEnd --></html> Cheers for any help! Niall Hey, I'm trying to write some code for expanding and concealing text You can see this in action at youtube when you click the (more) button to expand text. Suppose I had a heading: MyHeading and a body of text: MyTextHere How do I make it so that when you click MyHeading it makes MyTextHere (initially not visible) appear, and when you click MyHeading again, it makes MyTextHere disappear? Thanks Alot. Hi, I have a problem with validating Strict XHTML 1.0 ... The tag: "option" doesn't have an attribute: "onchange" in currently active versions.[XHTML 1.0 Strict]... Is there a way around this? Here's the code:. <select name="birth_month" onchange="form_d('yes');" size="1" style="width:8em"> <option<?php echo empty($a_birth_month)?' selected="selected"':''?> value="" onchange="form_d('yes');" >Month</option> Thanks Only another million pages to go. Rather than write them out i took a screenshot. So how do i get past those? In mininova.org, when we scroll down the page, ad on the right side is automatically adjusted. How to do achieve this using html? I want to implement the same in my site? First of all, I don't know what the thing is called that blinks inside a textarea. So if you could tell me what the name of that is, that'll be great. I'll called it a cursor for now. Here's the problem. Let's say I had a simple textarea with some values already filled in. Ex: Code: <textarea name="input1" rows="15" cols="75"> <!-- Cursor should go here --> ----- Original Message ----- From: blah To: Blah Date: Blah Blah Some Random Text </textarea> So, whenever a page loads, I need the "cursor" to be automatically at the beginning of the textarea (where "<!-- Cursor should go here -->" is). How would I go about doing that either in just HTML or Javascript? Usually when people place a footer at the bottom of a page they do it outside of the wrapper, so the footer is a first generation child of the body. However, I'm helping with a site that has shadow bars running down the sides of the wrapper div, and we want the footer to stick to the bottom, but inside of the wrapper. Currently any content that extends to where the footer is begins to overlap it. Here is my code: HTML Code: <html> <head> <title>Closeout Boat Sales</title> <link rel="stylesheet" type="text/css" href="style/styles.css" /> <!--[if IE]> <link rel="stylesheet" type="text/css" href="style/styles2.css" /> <![endif]--> <script type="text/javascript" src="jquery-1.7.1.min.js"></script> <script type="text/javascript" src="jquery.hoverIntent.minified.js"></script> <script type="text/javascript" src="scripts.js"> </script> </head> <body> <div id="wrapper"> <div id="header"> <?php include('header.php'); ?> </div> <div id="navcontainer"> <?php include('nav.html'); ?> </div> <br /> <div id="sidebar"> <p><img src="images/latest_sidebaroff.png" id="toggle1" /></p> <p><img src="images/bulk_sidebaroff.png" id="toggle2" /></p> </div> <div id="main"> <br /><br /> <div id="latest"> <table style="width: 100%"> <tr> <p><?php echo $dynamicList; ?></p> </tr></table> </div> </div> <div id="footer"> <?php include('footer.php');?> </div> </div> </body> </html> HTML Code: body,td,th { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #333; line-height:1.5em; margin: 0; } body { background-color: #fff; } #header h1 { font-size: 32px; display: inline; } #header a { font-size: 32px; color: #06C; text-decoration: none; } #cartBar { /*float:right; background-color: gray; */ width: 1003px; text-align: right; margin-left: -2px; } #wrapper { margin-left: 100px; height: 100%; width:1050px; padding-left: 40px; padding-top: 10px; background-color: #fff; background-image: url('../images/shadow-bar.png'); background-repeat: repeat-y; } #header { width: 1002px; margin-left: -19px; margin-top: -10px; padding: 3px; background-image: url('../images/headerBar.png'); } #sidebar { width: 250px; float: left; } #main { width: 800px; float: left; } #main a { font-weight: bold; color: #06c; } #main a:hover { color: #999; } #main a:visited { color: #06c; } #navcontainer { width: 100%; text-align: center; } #navcontainer li { /*float:left;*/ display:inline-block; list-style-type:none; position:relative; margin:0 10px; overflow:hidden; } #navcontainer li:hover { overflow:visible; } #navcontainer li ul { position:absolute; display:block; left:0px; top:20px; margin:0; width:110px; padding:0; background-color:#CCC; padding:0 10px 10px; } #navcontainer li ul li { float:none; margin:0; display:block; } #footer { margin-left: -19px; margin-bottom: -10px; height: 125px; width: 1009px; color: black; position: absolute; bottom: 0; font-size: 10pt; background-image: url('../images/footer.png'); } #footer a { color: #333; font-weight: bold; text-decoration: none; padding: 5px; } #bulk { display: none; } Any ideas? |