Jump to content
xisto Community
Sign in to follow this  
Followers 0
Albus Dumbledore

Getting An Image To Scroll On With Content

By Albus Dumbledore, in Programming

Recommended Posts

Albus Dumbledore    0

Albus Dumbledore
Posted

ok, well i had had people review Hogwartsmagic.net and they said that i should get it to not be one huge image as a layout..and i have figured most of it out and it has proven sucessful! but now i am having diffuclty, i am pretty much only a basicl HTML kinda person... and i was wondering if anyone knows an html code that will allow one image to scroll the entire length of a pages content? for example, if i were to add 200 links to the right navigation..the image would go with the content.. i am testing it out here HERE any help would be much appreciated

Share this post

Link to post
Share on other sites

jlhaslip    4

jlhaslip
Posted

Don't quite get what you are looking for. Do you want the lists to scroll and the image to stay positioned on the page?

Share this post

Link to post
Share on other sites

Albus Dumbledore    0

Albus Dumbledore
Posted

well, what i mean in that you can have a 1/4 inch image..as a main image...and have it multiply itself as many times as needed until it reaches for say the end of the content and connects with the footer...

Share this post

Link to post
Share on other sites

Avalon    1

Avalon
Posted

Not exactly sure what it is you want. If you want to repeat an image in a page I think the easiest is to use a table and set your image as the background. e.g. <table backgorund="image.jpg"> etc.. You can also CSS to set the background images of a table.

Share this post

Link to post
Share on other sites

Albus Dumbledore    0

Albus Dumbledore
Posted (edited)

ok, i understand what im saying is makin no sence maybe this one will help..

<html><title>Hogwarts Magic :. Where Real Magic is Possible! :.</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><meta name="keywords" content="Hogwarts Courtyard, Harry Potter, Ron Weasley, Hermione Granger, Lord of the Rings, Daniel Radcliffe, Rupert Grint, Emma Watson, Sorcerer's Stone, Chamber of Secrets, Prisoner of Azkaban, Goblet of Fire, Order of the Phoenix, Half-Blood Prince, Quidditch, Rowling"><meta name="description" content="Hogwarts Magic : Where Real Magic is Possible!"><meta name="generator" content="Microsoft Notepad"><meta name="author" content="Phillip Morehead"><meta name="copyright" content="© 2006 Phillip Morehead"><STYLE type=text/css>BODY {}A:link {	COLOR: #AABBCC; TEXT-DECORATION: underline;}A:active {	COLOR: #AABBCC; TEXT-DECORATION: underline;}A:visited {	COLOR: #AABBCC; TEXT-DECORATION: underline;}A:hover {	COLOR: #AABBCC; TEXT-DECORATION: none;}TD {	FONT-SIZE: 11px; COLOR: #ff0000; FONT-FAMILY: Verdana, Tahoma, Arial}</STYLE><script language="JavaScript" type="text/JavaScript"><!--function MM_reloadPage(init) {  //reloads the window if Nav4 resized  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {	document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();}MM_reloadPage(true);//--></script><img src="header.jpg" width="775" alt=""><body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><img src="index.jpg"><!-- ImageReady Slices (magic5.png) --><div id="navRight" style="position:absolute; width:125px; height:694px; z-index:3; left: 633px; top: 219px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;"> <div align="center"><?php include("site_files/bottom.html"); ?></div></div><div id="content" style="position:absolute; width:418px; height:746px; z-index:2; left: 176px; top: 193px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;"><p><font size=-2><center><img src="images/quidditch.gif"></center><br><B>Title:</B> Quidditch Through the Ages<BR><B>Author:</B> Kennilworthy Whisp<P>Quidditch Through the Ages is a great book to read if you like the Harry Potter books and the sport Quidditch.This book guides you from the beggining of Quidditch until the present of what Quidditch is now.The book is focused only on Quidditch, it talks about the many teams from England and many other countries as well. It also talks about where the bludgers came into existence, and why the teams have certain logos on their uniforms.The book mentions amazing events and things that have happened in historic matches. It also talks about how certain rules have changed through time.<br><br><br><center><img src="images/fantasticbeasts.gif"></center><br><br><B>Title:</B> Fantastic Beasts and Where to Find Them<BR><B>Author:</B> Newt Scamander<P>This is a reprint by Obscurus House of Newton Artemis Fido Scamander's classic magizoological reference work. Forward by Albus Dumbledore. This particular edition is the first to be offered to the non-wizarding public. The introduction covers the classification of magical creatures into beings, beasts, or spirits. The history, politics, and fine points of this division is examined.<P>Next, there is a section on the concealment of magical beasts from the non-wizarding public. This includes the establishment of safe habitats, as well as the use of disillusionment charms, memory charms, and other techniques. The activities of the Office of Misinformation in spreading false information are also examined. The Ministry of Magic classifications of all known magical creatures from XXXXX (known wizard killer) to X (positively boring) are listed and defined.<P>The main body of the reference lists all known magical creatures alphabetically. The M.O.M. classification, physical description, habitat, behavior, and distribution are clearly and concisely noted for each entry. These entries are: Acromantula, Ashwinder, Augurey, Basilisk, Billywig, Bowtruckle, Bundimum, Centaur, Chimaera, Chizpurfle, Clabbert, Crup, Demiguise, Diricawl, Doxy, Dragon (all breeds), Dugbog, Erkling, Erumpent, Fairy, Fire Crab, Flobberworm, Fwooper, Ghoul, Glumbumble, Gnome, Graphorn, Griffin, Grindylow, Hippocampus, Hippogriff, Horklump, Imp, Jarvey, Jobberknoll, Kappa, Kelpie, Knarl, Kneazle, Leprechaun, Lethifold, Lobalug, Mackled Malaclaw, Manticore, Merpeople, Moke, Mooncalf, Murtlap, Niffler, Nogtail, Nundu, Occamy, Phoenix, Pixie, Plimpy, Pogrebin, Porlock, Puffskein, Quintaped, Ramora, Red Cap, Re'em, Runespoor, Salamander, Sea Serpent, Shrake, Snidget, Sphinx, Streeler, Tebo, Troll, Unicorn, Werewolf, Winged Horse, and Yeti.	  </p></font></div><div id="navLeft" style="position:absolute; width:119px; height:636px; z-index:1; left: 17px; top: 248px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;"><?php include("site_files/menu.html"); ?> </table><!-- END IMAGE READY --!><img src="footer.jpg"></body></html>

the stuff in bold, *edit ok, not bold..but all the image codes *edit* i want the images to be looped like that, until the end of the content, just without having to have so many, of the <img src....'s if you look at the page that is kind of what i wish it to look like

i have tryed both of those, but i cant get it to work
Edited by Albus Dumbledore (see edit history)

Share this post

Link to post
Share on other sites

Avalon    1

Avalon
Posted

Try something like this, starting from the line below your <body> tags.

<table background="index.jpg"><tr><td><!-- ImageReady Slices (magic5.png) --><div id="navRight" style="position:absolute; width:125px; height:694px; z-index:3; left: 633px; top: 219px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;"> <div align="center"><?php include("site_files/bottom.html"); ?></div></div><div id="content" style="position:absolute; width:418px; height:746px; z-index:2; left: 176px; top: 193px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;"><p><font size=-2><center><img src="images/quidditch.gif"></center><br><B>Title:</B> Quidditch Through the Ages<BR><B>Author:</B> Kennilworthy Whisp<P>Quidditch Through the Ages is a great book to read if you like the Harry Potter books and the sport Quidditch.This book guides you from the beggining of Quidditch until the present of what Quidditch is now.The book is focused only on Quidditch, it talks about the many teams from England and many other countries as well. It also talks about where the bludgers came into existence, and why the teams have certain logos on their uniforms.The book mentions amazing events and things that have happened in historic matches. It also talks about how certain rules have changed through time.<br><br><br><center><img src="images/fantasticbeasts.gif"></center><br><br><B>Title:</B> Fantastic Beasts and Where to Find Them<BR><B>Author:</B> Newt Scamander<P>This is a reprint by Obscurus House of Newton Artemis Fido Scamander's classic magizoological reference work. Forward by Albus Dumbledore. This particular edition is the first to be offered to the non-wizarding public. The introduction covers the classification of magical creatures into beings, beasts, or spirits. The history, politics, and fine points of this division is examined.<P>Next, there is a section on the concealment of magical beasts from the non-wizarding public. This includes the establishment of safe habitats, as well as the use of disillusionment charms, memory charms, and other techniques. The activities of the Office of Misinformation in spreading false information are also examined. The Ministry of Magic classifications of all known magical creatures from XXXXX (known wizard killer) to X (positively boring) are listed and defined.<P>The main body of the reference lists all known magical creatures alphabetically. The M.O.M. classification, physical description, habitat, behavior, and distribution are clearly and concisely noted for each entry. These entries are: Acromantula, Ashwinder, Augurey, Basilisk, Billywig, Bowtruckle, Bundimum, Centaur, Chimaera, Chizpurfle, Clabbert, Crup, Demiguise, Diricawl, Doxy, Dragon (all breeds), Dugbog, Erkling, Erumpent, Fairy, Fire Crab, Flobberworm, Fwooper, Ghoul, Glumbumble, Gnome, Graphorn, Griffin, Grindylow, Hippocampus, Hippogriff, Horklump, Imp, Jarvey, Jobberknoll, Kappa, Kelpie, Knarl, Kneazle, Leprechaun, Lethifold, Lobalug, Mackled Malaclaw, Manticore, Merpeople, Moke, Mooncalf, Murtlap, Niffler, Nogtail, Nundu, Occamy, Phoenix, Pixie, Plimpy, Pogrebin, Porlock, Puffskein, Quintaped, Ramora, Red Cap, Re'em, Runespoor, Salamander, Sea Serpent, Shrake, Snidget, Sphinx, Streeler, Tebo, Troll, Unicorn, Werewolf, Winged Horse, and Yeti.	  </p></font></div><div id="navLeft" style="position:absolute; width:119px; height:636px; z-index:1; left: 17px; top: 248px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;"><?php include("site_files/menu.html"); ?></tr></td></table><!-- END IMAGE READY --!>
I notice also that you have an image tag <img src="header.jpg" width="775" alt=""> above your body tags. There should really be no content above your body tags, scripts can go above the body tags but not images or content text.

Share this post

Link to post
Share on other sites

Albus Dumbledore    0

Albus Dumbledore
Posted

i tryed that jsut now, and it didn't do anything maybe the dividing code doesn't allow it? lol...i love computers but when it gets complicated it gets weird >_< thanx for all ya help...

Share this post

Link to post
Share on other sites

Albus Dumbledore    0

Albus Dumbledore
Posted

well i added that, and it does extend to the content like it should, i just got the problem of the footer is like still at the top...ne ideals? thnx! soo much for that code!

Share this post

Link to post
Share on other sites

jlhaslip    4

jlhaslip
Posted

try this:

<div id=footer style="clear:both"><img src="footer.gif" /></div>

Replace the existing footer image code with a div styled to clear the columns. There more complete answers, but if this works, that's good...

Share this post

Link to post
Share on other sites

Albus Dumbledore    0

Albus Dumbledore
Posted

well that doesn't work either, i thanx you for all of your help....but i think i am going to take umm, avalon's ideal on using tables and seeing if that works which i hope it does, if not i shall come back to the forum and see if neone else has put up any suggestions...thanx again for you and avalons help..

Share this post

Link to post
Share on other sites

jlhaslip    4

jlhaslip
Posted

Okay, this ought to work... Check here to see an example in action.

There is a containing div which includes the full width header div followed by a sidebar div of a %'ge width and the main content div with a margin to suit the width of the sidebar div. The sidebar and content don't conflict with each other. The sidebar is floated to the left hand side of the page and the content has a margin of the same width as the sidebar. No absolute positioning is required.

THEN, the footer is added to the bottom of the page OUTSIDE of the containing div so that it is always below the longest of either the sidebar or the content.
I suppose there could be an overall wrapper div to contain the whole works, but it works this way. And at one time it validated, too, so whatever it takes is good for me.

The css is here . (I'll clean it up later) ( ya, right)

Share this post

Link to post
Share on other sites

Albus Dumbledore    0

Albus Dumbledore
Posted

well i tryed that and i still couldn't get it to work.FOR NOW i am done with this problem because i just give up >_< but if anyone comes to the forum and has a solution to this problem please feel free to post the answer here or PM it to me if this gets closed..thank you two for all your help..

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
Followers 0
Go To Topic Listing
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.

  I accept