HTML - Make Parts Of The Page Scroll With You?
Hi, I am very new to HTML and our webdesigners have run off without completing the job properly so I am trying to do it myself.
The problem is with the "News" page of the site which is a tumblr page configured to look like the rest of the site. Rather than come on here and list all the problems with it I thought I'd tackle one at a time. The first thing I am trying to achieve is making the area in which posts are not submitted (the header, and the left and right) scroll down with you. So as you scroll down through the posts you can still see the links at the top of the page and on the sides. Is this possible? Here is the page I am talking about: http://secret-store.tumblr.com/ Thanks for any help guys. Similar TutorialsSome mouses today have horizontal scroll, some call the tilt. It looks something like: http://www.htmlforums.com/attachment...1&d=1242556560 I noticed that many websites they code those horizontal scroll to go to next/prevous page. For example Discuz! forum system has this function. While you browse hundreds or thousands of posts separated into pages, the horizontal scroll can take you to previous page or next page.(not browser back/forward) How do I code like that? Or any examples? I'm ultra new to html and I made a super basic navigation bar for my page, the problem is when the browser is made small side-to-side, instead of adding a scroller at the bottom and keeping the links in line, it just smashes them up and starts moving them below each other. How do I change that ? Here is a link to the page I'm talking about so you can see it. http://www.neonloveco.com/home Thanks everyone how do you make an inline fame that does not have scroll bars but resizes the parent page to allow the whole child page to fit in the parent I have this 2 scripts: 1. script Allowed me to make URL switching (new page is opened after 20 sec) 2. script Allowed me a vertical scroll My Question: HOW TO MAKE THIS: I WANT EACH SITE TO OPEN AUTOMATICALLY LIKE IN 1. SCRIPT AND TO BEGIN TO SCROLL AUTOMATICALLY AFTER OPENING DURING 20 SEC... THAN SWITCHING TO A NEW PAGE, SCROLLING VERTICALY DURING 20 SECONDS... AND SO FOR EACH SWITCHING WEBPAGE... 1. script: <html> <head> <title>URL Switcher</title> <script language="JavaScript" src="url_switcher.js"> </script> <script language="JavaScript"> var i = 0; var url_array = new Array(); url_array[0] = "http://www.google.com"; url_array[1] = "http://www.codingforums.com"; url_array[2] = "http://www.ebay.com"; url_array[3] = "http://wm2.uvic.ca"; function changeURL(ms) { document.frames['my_frame'].location.replace(url_array[i]); i = (i+1)%url_array.length; setTimeout("changeURL("+ms+")", ms); } </script> </head> <body style="margin:0px; overflow-y:hidden" onLoad="changeURL(20000);"> <iframe name="my_frame" width="100%" height="100%" border="0" frameborder="0"></iframe> </body> </html> 2. script: <!-- Vertical Scroll Use this script to automatically scroll the web page when the user pushes a button --> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function CoffeeScroll() { for (I=1; I<=750; I++){ parent.scroll(1,I) } } // End --> </SCRIPT> <!-- Put this into the BODY of your webpage --> <BODY><CENTER><FORM><input type=button value="Scroll Page" onClick="CoffeeScroll()"></FORM></CENTER> THANK YOU VERY MUCH FOR YOUR HELP Despite reading multiple posts on "scrollable" table cells on the forums, I've not yet quite found the answer to my question, so hopefully I can get some feedback from all viewers out there! I and some friends run a small Catholic arts and crafts website (www.illuminatedink.com) through which we sell products that we create. I've based the page layout on a table instead of frames or iframes. The table has 3 cells in it. The entire top "banner area" of the screen is one cell. Below that on the left we have the naviagation menu cell. The main content that someone is trying to view appears in the remaining lower right cell (also the largest). This page works great on all the computers at my house (3 of them) and on most other computers as well. I have yet to test this in IE 7.0, but if someone else has that browser, please let me know what happens. So, what's the problem you ask? That lower right table cell where all the content appears does not work for everyone. I just got another complaint today that no scroll bar appears and the person can only see what's in the top of cell, there is no "scrollability". Here is a sample (with notes made by me in ** NOTE ** format). The notes are of course not in the actual code, I am showing only the code really matters here. Code: <BODY STYLE="margin-top: 0px; margin-left: 0px"> <TABLE CELLPADDING=0 CELLSPACING=0 HEIGHT=590 WIDTH=1000> <TR HEIGHT=90> <TD WIDTH=1000 COLSPAN=2 STYLE="background-image:url('http://www.illuminatedink.com/images/background/banner.jpg')">   </TD> </TR> <TR HEIGHT=500> <TD VALIGN=top WIDTH=200 STYLE="background-image:url('http://www.illuminatedink.com/images/background/menu_bar.jpg');background-repeat:no-repeat"> <TABLE ALIGN="center" CELLSPACING=0 CELLPADDING=0> **Navigation menu on the left side goes here** </TABLE> </TD> <TD WIDTH=800 VALIGN="top"> <DIV STYLE="overflow:auto;height:490px;width:800px;position:absolute;left:200;padding-right:30px; padding-left:0px"><MAP NAME="page_links"> **All code for the scrollable cell in the lower right goes here** </DIV> </TD> </TR> </TABLE> </BODY> So, can anyone possibly tell me why this would have a scroll bar in some browers and not in others? Or does anyone have any code changes I could make that may guarantee that they will get a scroll bar in that lower right cell? The complaints that I have received mainly seem to be from Mac users using IE for Mac. But I just had someone who had a brand new Dell with Windows XP Prof. and the most recent IE 6, which is exactly the configuration I run, but didn't get a scroll bar when I did. Ideas? Thank you! I believe in thread titles that get to the point. I have a basic page, when the page loads I want people to see the top of the page for a few seconds while a flash starts to load but then I want the page to scroll down a bit so the visitor can see the flash load progress status. I just want code that I can copy into my page. I don't have access to the flash code. Greg (the page under design) www.mytcanada.com/designer.html I have a programmer in the US who starts pages for me and then I much around with them until it's looks like I want. He helps me when I get stuck but he's on holidays. Any help would be great. I am stuck with this stupid code that i have been trying to fix for an hour! Please help. Heres my problem...: I want to embed a webpage within another and scroll it to the bottom of the page automaticly because i want the information at the bottom which is updated frequently. I also dont want a scroll bar, so all that is seen is the table. the website is www.totalfta.com. I want from below the ENTER|EXIT sign to the bottom of the table. I have attached what i have so far. ***I have the embed into another page, and the no scroll bar... i just want to make it auto scroll to the table..**** Thank you..! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-... <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Tester</title> </head> <iframe height="410" width="100%" frameBorder="0" src="http://www.totalfta.com" mce_src="http://www.totalfta.com" scrolling="no" body onLoad="for (i=0;i<window.screen.availHeight;i++) {window.scroll(0,i); }"</iframe> <body> Can someone help me figure out why you cant scroll up or down to view the rest of this web page I'm making? Thank you. http://carsonvalleypowerwash.com New poster here! Recently been creating a website using HTML & CSS from scratch using Notepad++. I was under the impression that the more flat, or spread out the design, browsers would squish it automatically to fit on the page. Apparently this is not the case. I current have a page where the main content starts 250 pixels from the left hand side of the screen, this causes some of the content disappear of the right hand side of on lower resolution screens. Should I be starting the content at the far left, or is there another web page design convention I should be following? I assume there is a way around this however I can't seem to find it! Any help would be greatly appreciated. These forums are a wealth of knowledge! Please follow this link and observe how the page scrolls up after you have been taken there. It scrolls up because, unless you've been here before and have all the images stored on your computer, the images are continually downloaded and they expand the height of the page causing it to expand down and causing your browser to scroll up. Incidentally, the point at which you were supposed to be linked to ends up further down the page. Is there a way of preventing this? Is there a way of getting the browser to stick to the original point on the page where you were linked to? Hi All , In my page, it has two div, one on the left side to do navigation stuff and the right one to display contents of page. How can I create a scroll bar just on the right div so that when it scroll, the div on the left side wont move. REgards Can anyone help me out? I've set up a test site for a project where I have a scrollable table within an iFrame. Techincally, its an iFrame within an iFrame which gets you to a scrollable table I also added an auto-scroll with anchor-links. Everything finally works, but I really want to remove the horizontal-scroll bar that shows up, while keeping the vertical-scroll bar. (Upon testing, I found without the vertical-scroll bar, the anchor-links and auto-scroll don't work correctly.) here's the link to the test site: http://www.thegrandamerican.com/ here's the line of code I think is the correct place to make corrections: <iframe id="myiframe" name="myiframe" src="oprah june 09_news.htm" width="900" height="475" scrolling="yes" overflow-y: scroll></iframe> The hierarchy works as follows: index.htm > spotlight_news.htm > oprah june 09_news.htm The reason for all the iframes is to have elements on the higher pages that will stay in place, such as a music player and dynamic menu bar. other notes and associated files (for the auto scroll) a smooth-src-comments.js smooth.pack.js Thanks. - J Hi I am not sure where to post this so i am sorry if its in the wrong place , my question is i want to prtoect parts of a website i have made from being access unless the come thru the correct reffer pages first say i have 4 pages i want to protect www.mydomain.com/page1 www.mydomain.com/page2 www.mydomain.com/page3 www.mydomain.com/page4 but i only want them to be access if they com from certain parts of my site where i have linked to them .... etc.... But i dont want to password protect them i just want them to accessed thru the correct pages , I have heard that i can do this using .htaccess but i am not sure how if anyone could help that would be great hi, i want to create a screenshot of the webpage once is displayed on the client browser. Let's say, there is some php and javascript. The php code runs, than javascript code run. After that I want to make a screenshot and store it on the server. I guess I need a client side javascript code sending back an image to the server. Is that possible ? easy ? thanks I have wrote this <html> <body> <script type="text/javascript"> var w=window.open(); w.document.open(); w.document.write("FirstLine<br>SecondLine<br>"); w.document.close(); </script> </body> </html> This simply creates anew window and outputs text onto it... What I want is for the specified text, to be outputed to a new html file For instance, OutPut1.html or OutPut2.html and so on. And for clarification, I do not want to manually create each new file for html to write to. I want the main html to create these new files Thank you all in Advance for all help given sorry im really new at this stuff. so i have the code, and i need to make & view the page.. so how do i do that?? thanks Greetings I have this problem that i have menu in Iframe and from that iframe i have link to another page. Now when i click the link it opens the link in the iframe window and does not move me completely on the new page. How do i put link that will get me to new page, and does not open it in the iframe window? Also i have another page with PHP include, would love to know the same thing in PHP. So i have this link that opens in the IFrame window, but i dont want to open it in IFRAME, but i want to move completely to the page the link shows. Also i don't want to open it in new window, i want it open in same window. Thanks for help! I need help with this html page. I would like the disclaimer at the bottom of the page to not follow the body. Is that possible? Take a look at this html and let me know if it is possible to recode it to show the disclaimer across the entire width of the page bottom as in this url : http://www.stocktraderspress.com/mem..._01112012.html Here is the html code for the new page I am trying to edit: <html> <head> <title>Stock Traders Press :: 2011 Performance</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- .style3 { font-size: 24px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; } .style4 { font-size: 18px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; } .style11 {font-size: 10px} .style15 {font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; } .numbersbody { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; text-align: center; } .datebody { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; text-align: right; } .tickerbody { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; text-align: left; } .style17 {font-size: 14px; font-family: Arial, Helvetica, sans-serif;} --> </style> </head> <body bgcolor="#FFFFFF" text="#000000" marginwidth="0" marginheight="0"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tbody> <tr align="center" valign="middle" bgcolor="#FFFFFF"> <td width="20%" height="19">*</td> <td width="20%" height="19">*</td> <td width="20%" height="19">*</td> <td width="20%" height="19">*</td> <td width="20%" height="19">*</td> </tr> <tr align="center" valign="middle" bgcolor="#FFFFFF"> <td colspan="5"> <table width="89%" border="1" cellpadding="10" cellspacing="0"> <tbody> <tr> <td valign="middle" bgcolor="#FFFFFF"> <table width="100%" border="0" cellpadding="2" cellspacing="0"> <tbody> <tr> <td colspan="5"><img src="/stp_logo.gif" width="363" height="42"></td> <td>*</td> <td><span class="style3">2011 Performance</span></td> </tr> <tr> <td colspan="2"><a href="/members/welcome.php">Go Back </a></td> <td colspan="5"><span class="style4">************************** </span></td> </tr> <tr> <td colspan="7"><span class="style4">These are the recommendations our Firm made in 2011 </span></td> </tr> <tr> <td colspan="7"><span class="style4">By purchasing an equal amount of every stock, you would have had an average gain of 9.41%</span> </td> </tr> <tr> <td width="87">*</td> <td width="115">*</td> <td width="80">*</td> <td width="79">*</td> <td width="197">*</td> <td width="140">*</td> <td width="175">*</td> </tr> <tr> <td colspan="2" class="style15">Closed Positions </td> <td>*</td> <td>*</td> <td>*</td> <td>*</td> <td>*</td> </tr> <tr bgcolor="#CCCCCC"> <td> <div align="center"> <strong><span class="style17">Stock</span></strong></div> </td> <td> <div align="center"> <strong><span class="style17">Date Bought</span></strong></div> </td> <td> <div align="center"> <strong><span class="style17">Date Sold </span></strong></div> </td> <td> <div align="center"> <strong><span class="style17">Time Held </span></strong></div> </td> <td> <div align="center"> <strong><span class="style17">Price (Recommended) </span></strong></div> </td> <td> <div align="center"> <strong><span class="style17">Price (Sold) </span></strong></div> </td> <td> <div align="center"> <strong><span class="style17">Profit/Loss</span></strong></div> </td> </tr> <tr> <tr bgcolor="#E6FFFF"> <td class="tickerbody">GT</td> <td class="numbersbody">01/05/2011</td> <td class="numbersbody">04/29/2011</td> <td class="numbersbody">114 Days</td> <td class="numbersbody">$12.69</td> <td class="numbersbody">$18.20</td> <td class="numbersbody">43.42%</td> </tr> <tr bgcolor="#E6FFFF"> <td class="tickerbody">CMG*</td> <td class="numbersbody">07/08/2011</td> <td class="numbersbody">08/18/2011</td> <td class="numbersbody">41 Days</td> <td class="numbersbody">$325</td> <td class="numbersbody">$285</td> <td class="numbersbody">12.36%</td> <td class="numbersbody">*Cover of a Short position</td> </tr> <tr bgcolor="#E6FFFF"> <td class="tickerbody">GT</td> <td class="numbersbody">09/06/2011</td> <td class="numbersbody">10/24/2011</td> <td class="numbersbody">2 1/2 months</td> <td class="numbersbody">$11.11</td> <td class="numbersbody">$13.58</td> <td class="numbersbody">24.46%</td> </tr> <tr bgcolor="#E6FFFF"> <td class="tickerbody">OLN</td> <td class="datebody">10/04/2011</td> <td class="numbersbody">10/27/2011</td> <td class="numbersbody">23 Days</td> <td class="numbersbody">17.17</td> <td class="numbersbody">$21.37</td> <td class="numbersbody">24.46%</td> </tr> http://www.ivoog.com/test The page is COMPLETELY messed up in IE 6. I am not sure what I have done wrong as everything I see is ok. How can it look exactly like IE 7? What changes? Thanks. Working on this site and I like the template but I'm tying to make it more inviting, any ideas? Not very creative here.. www.baysidesuperior.org/Bayside/ministries.html |