billydocks
-
Content Count
10 -
Joined
-
Last visited
-
Thanks James. Problem solved. Champion
-
Hi all.New to javascript so this is a pretty basic question. I have gone through the W3C tute and another tutorial online (which I based my example off, just for something to learn/practice on). var drink = "beer";var lyrics = "";var cans = 10;while (cans > 0) { lyrics = lyrics + cans + " cans of " + drink + " on the wall <br>"; lyrics = lyrics + cans + " cans of " + drink + "<br>"; lyrics = lyrics + "take one down, pass it around,<br>"; if (cans > 1) { lyrics = lyrics + (cans-1) + " cans of " + drink + " on the wall <br><br>";}else { lyrics = lyrics + "no more cans of " + drink + " on the wall <br>";}cans = cans - 1;}document.write(lyrics); Apologies for pasting the whole lot in there, but I am not sure how else to be clear with my question, which is this:How can I change the 'cans' plural to be just 'can' when the amount of cans reaches 1? If I insert a if (can == 1) in there, the condition is met and the script does not run on to the else { section to reveal there are no more cans of beer on the wall. I hope this question makes sense. I am fairly certain it should be an easy fix, but I've tried re-reading through the W3C tutorial without finding a clue (or perhaps more to the point, not recognising a possible solution).Thanks for the help!bd
-
Hi all. Back with another problem. I'm not entirely sure if an iframe is really what i need, but I suspect it is one possible solution. I have created a website here: greatearthquake.com.au - and now I'd like for the HTML links to cause a little box (frame/iframe, I'm not sure of the correct terminology sorry) to appear where I can insert more content. At the moment, the only link that works is the "P" to the photos, but that loads a demo album I put together quickly in Bridge in a new page. I ideally want this content to appear on top of the home page image. I hope that makes sense. I have an unordered list and one line of text in the <body>, the rest so far is CSS. When I go to insert an <iframe> tag, it appears only above/below the current background (which is only a background for the #navlist, there is no background for the whole page). If I stick the <iframe> in between the <ul> and between the <li id> somewhere, it is not visible at all. Am I completely misunderstand how iframes are supposed to work? Obviously there is a mistake (or many) that I'm making. Is there a better way to accomplish this appearing box/frame idea, assuming it is possible at all? Thanks in advance!
-
Ah! I've figured it out myself. I insert {left: x; and top: x;} values after the background coordinates and this positions the sprites where I want them to be. Thanks Ingolme for the help to get me this far. If you notice any redundant/incorrect CSS, or something I could do more efficiently, and can be bothered to note it down for me, feel free. Rest assured I'll be back with more questions on a different topic soon!
-
Hello again, apologies for my slow progress on this. I am attempting to learn image sprites in my "spare time" (a misnomer, surely), which means unfortunately I only get to it about once a week. I do very much appreciate your help though. Thanks for all of it so far. Your tip regarding turning the link into a block was what I was missing, thanks Ingolme. And after re-reading the W3 tutorial, I understand what I'm doing a lot more now. I am fairly confident I have everything sorted out now, except one last thing.The sprites work, the bg image changes with the mouse hover, but all my images/links are piled on top of each other. i can't figure out how to position them all around to where they are supposed to be in the larger bg image. i'll attach a screen shotyou can see all the blocks are grouped in the top left. here is my css: #navlist { background-image: url(images/background_72_spr.jpg); background-repeat: no-repeat; position:relative; height: 710px; width: 950px; text-indent: -9999px; list-style-image: none; list-style-type: none; margin: 0 0 0 0; padding: 0 0 0 0;} #navlist li { position:absolute; margin:0; padding:0; list-style:none; }#news { background-image: url(images/background_72_spr.jpg); background-position: -152px -207px;}#news a:hover { background: url(images/background_72_spr.jpg) -152px -917px;}#news a, #news a:visited { display:block; width: 307px; height: 110px; } the last #news group is repeated for each link, but i'll leave them out to save you reading 5 more groups of identical CSS coding.the HTML has not changed from my initial post in this thread. Thank you again for the help!
-
Thanks Ingolme. I'll have another read through the tryit editor and attempt to understand it more clearly with what you've explained here in mind.
-
hi there,Ingolme put me on to image sprites for a problem I had over a month ago but I have only just yesterday sat down to figure it all out.I have created a background image which is repeated directly below with the changed colours on the relevant parts, and I have only the top half showing as the background image, so I can get that far without trouble. I am not using regular boxes or standard shapes but that should not matter as long as I enter the correct pixel coordinates, is that right?I am confused as to the next step in the process. I can't seem to get my head around the coding as explained in the W3C tutorial. i have this in the HTML <body> <ul id="navlist"> <li id="news"><a href="news.html">News</a></li> <li id="photos"><a href="photos.html">Photos</a></li> <li id="links"><a href="links.html">Links</a></li> <li id="music"><a href="music.html">Music</a></li></ul> </body> and this in the CSS #navlist li { float:left; list-style:none; display:inline; text-indent: -9999em;}#navlist { background-image: url(images/background_72_spr.jpg); background-repeat: no-repeat; float: left; height: 710px; width: 950px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; text-indent: -9999px; list-style-image: none; list-style-type: none;} #news { width: 307px; height:110px; }#photos { width: 153px; height:47px; }#links {width: 88px; height:57px; } #news a:hover { background-image: url(images/background_72_spr.jpg); margin-top: 207px; margin-left: 151px;} I haven't gone past 'news' because I thought I'd make sure I could get one working before typing all the rest of the code out and discovering it need correction also. I know there must be a glaring error, but as I am so new to this whole thing I can't spot it. I have tried different things for hours today but still can't figure it out. I'll attach the image so you can see that if you need it. I apologise if this posting of lots of code is against the rules on this forum. Please let me know and I will edit it immediately. If anyone can provide assistance, it'd be greatly appreciated. Cheers!
-
Great. This gives me plenty to look into and play around with. Thanks for the help.
-
Cheers. The image maps look interesting, I'll look into that. Does this mean I can program sections of the background image to disappear/appear on mouse roll over, or do you mean, using CSS, each page would have only certain portions of the background image visible ? or both, or am I misunderstanding completely?
-
Hello everyone,I am brand new to this, as may already be evident from the wording of my thread title. After some reading and practice, I am fairly confident on the basics of CSS and XHTML, and I am wanting to push myself a little. In the website I am creating for my own practice sake, I have an external CSS page which is working satisfactorily for basic things around the website. Now I'd like to see if I can make certain sections of the background image to be links to other pages, instead of the HTML navbar I have created. So if I want different sections or elements of the background image to link to other pages on the website, is there a way to do this? If this is written into external CSS, then it should be the same site-wide, correct? Perhaps I am biting off more than is helpful for me to chew at the moment. Any suggestions/corrections are welcome.Thank you for your time. It is much appreciated.
