is this coding correct?

**brit** · 09-28-2003, 04:51 PM

Can anyone tell me if this coding is correct. I have it for one of my test pages;

http://www.itsmysite.com/cgi-bin/it...bdir=brit

I am a complete beginner to all this, so any help appreciated! If wrong, which parts do I need to edit or delete. I designed the above page on 800x600 resolution. Am not sure if the layout is ok however, as I am told layout differs in appearance according to which resolution settings you have.

Here's the coding;

<html>
<head>
<p><br>
<style type="text/css">
a:link {color: #FF99CC}
a:visited {color: #FF99CC}
a:hover {color: #FFFFFF}
a:active {color: #FFFFFF}
</style>
<style type="text/css">

</style
</head>

<body><script language="JavaScript1.2">

/*
Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and TOS, visit http://www.dynamicdrive.com
Credit MUST stay intact
*/

//Specify the marquee's width (in pixels)
var marqueewidth="640px"
//Specify the marquee's height
var marqueeheight="165px"
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=1
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=1

//Specify the marquee's content
//Keep all content on ONE line, and backslash any single quotations (ie: that's great):

var marqueecontent='<font face="Verdana"color="#FF99CC"><p><br><p><br><p><br >Text text text text text text text text text text text text text text text text text text etc, etc....<p><br><br></font>'

////NO NEED TO EDIT BELOW THIS LINE////////////

marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
var actualheight=''
var cross_marquee, ns_marquee

function populate(){
if (iedom){
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee.style.top=parseInt(marqueeheight)+8+ "px"
cross_marquee.innerHTML=marqueecontent
actualheight=cross_marquee.offsetHeight
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee 2
ns_marquee.top=parseInt(marqueeheight)+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualheight=ns_marquee.document.height
}
lefttime=setInterval("scrollmarquee()",20)
}
window.onload=populate

function scrollmarquee(){

if (iedom){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
cross_marquee.style.top=parseInt(cross_marquee.sty le.top)-copyspeed+"px"
else
cross_marquee.style.top=parseInt(marqueeheight)+8+ "px"
}
else if (document.layers){
if (ns_marquee.top>(actualheight*(-1)+8))
ns_marquee.top-=copyspeed
else
ns_marquee.top=parseInt(marqueeheight)+8
}
}

if (iedom||document.layers){
with (document){
if (iedom){
write('<div style=" position:relative;width:'+marqueewidth+';height:'+
marqueeheight+';overflow:hidden" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0px;top:0px;width:10 0%;">')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee">')
write('<layer name="ns_marquee2" width='+marqueewidth+' height='+marqueeheight+' left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
}
}
</script>

Thanks,

Brit

**brit** · 09-28-2003, 05:00 PM

http://www.itsmysite.com/cgi-bin/its...=1&webdir=brit

Sorry, page link should have been as above.

Brit

**techguru** · 09-28-2003, 05:03 PM

marqueewidth="640px"

Will fit on the screen for all standard screen resolutions.

**brit** · 09-28-2003, 05:19 PM

So does that mean the page looks ok? Is there nothing I have to edit out?

(I wasn't sure if the coding was ok or not? I was told the layout looks different using higher resolution, but am going to put a message that it is best viewed only at 600x800 for now.)

Thanks, Brit

**techguru** · 09-28-2003, 05:25 PM

In higher resolution it will just look smaller on the page. No need to edit.

**brit** · 09-28-2003, 05:50 PM

Ok, thanks for viewing that. I was told I had one too many head and body tags in there somewhere, and I wasn't too sure if that would affect layout?

Does anyone have an idea on how to erase the white box around the silver coloured 'back' tab (the triangle)? It messes up the appearance of the page.

If others are viewing the above link and anything looks funny in layout....; please do say so, as am thinking of doing more than one page like that (probably 8 or 9 in total).

Brit

**techwench** · 09-28-2003, 09:30 PM

I see what you mean about people saying it looks "funny" on higher resolutions. Your background image is wrapping. It doesn't show up on 800x600, but on higher resolutions, you will be able to see the tiled image.

You could take out the BACKGROUND attribute in your BODY tag, and instead put this into your STYLE tag:

Code:

BODY  {
        background-image:url('images/seb_bg_image2.jpg');
        background-repeat:no-repeat;
      }

**brit** · 09-29-2003, 03:42 AM

Ok... Where exactly in the above coding would that go? Could you write the exact part... Sorry, I am a total beginner with this, and on my host site they do the background image for you, just by uploading the image on the 'background settings' page.

Other than the image background, does everything else look ok on 800x600 and higher resolution?

Would really appreciate if somebody could tell me how to erase the white box around the back button...; it has got me stumped

Thanks for the help!

**techwench** · 09-29-2003, 10:00 AM

In order to change the background image to not tile, you will need access to your index.html file. If your host allows you to edit html files directly, then look for your <HEAD></HEAD> tags.

Then, add the following code between your head tags:

Code:

<STYLE TYPE="text/css">
<!--
  BODY  {
          background-image:url('images/seb_bg_image2.jpg');
          background-repeat:no-repeat;
        }
//-->
</STYLE>

As for the arrow image, you will need an image editor that can create transparent gifs. You need to delete the white background and "preserve transparency" when saving the new file.

**Assie** · 09-29-2003, 12:23 PM

the look of that riangle is bad because its a jpg insteat of a gif that can have a transparent background.

if you do use transparent gif triangle's you can use them on every background with out having disturbed the vieuw.

if you want to have transparent triangle please do mail me at:
a.w.jansen@chello.nl
and i can make them for you if you cant do that yourself

**brit** · 09-29-2003, 02:15 PM

Thanks for that... The coding I gave out is exactly how it is in the html file... Where does it go? Tried it myself but still have tiling in higher resolution.

Sent you an email about the triangles...

Thanks!

**Assie** · 09-29-2003, 02:27 PM

the gif's should be in your mailbox now

regards Assie

**brit** · 09-29-2003, 02:51 PM

They both (unfrtunately) look a bit out of place on the page (white background still shows a little). I think I will try looking at other buttons, as this seems to be more difficult than I first thought.

Thank you so much for trying though!! It was nice of you

Brit

**techwench** · 09-29-2003, 03:13 PM

If that is the complete code that you see when you edit, then your server is running a script that inserts the rest of the values into your page. Because in the code above, there is a blank <BODY> tag. But when I view the source of your page, I get this:

<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#840084" BACKGROUND="http://www.itsmysite.com/blushybrit/images/seb_bg_image2.jpg" onload="banner()">

If your page editor has a separate funtion to insert the background image into your site, take it out, and use the style tag I posted above. Put it on a line just before the </HEAD> tag.

**S-L-D** · 09-29-2003, 07:27 PM

dumb question...

where or rather how did you get the original code again ?

SECRET LEMONADE DRINKER

**brit** · 09-29-2003, 08:27 PM

I got it from the following link at dynamicdrive.com

http://www.dynamicdrive.com/dynamicindex2/cmarquee2.htm

However, I did add part of another code (css) to it also, for the colours and so on, so am not entirely sure if I put it in right place or not. The exact coding I have on file for the page is as it is above.

Havent made up all the pages yet, so obviously want to see it it is right (or not) before I proceed any further.

Prissed; will try the background coding later - Thanks for that.

Brit

**brit** · 10-01-2003, 10:20 AM

This is where I put the extra coding so the background doesnt tile, but no image pops up. I made sure I deleted the background image on my host first, before I inserted the new line of code.

Here's where I put it, but I have obviously inserted it the wrong place somewhere

<html>
<head>
<p><br>
<style type="text/css">
a:link {color: #FF99CC}
a:visited {color: #FF99CC}
a:hover {color: #FFFFFF}
a:active {color: #FFFFFF}
</style>
<style type="text/css">

</style
BODY {
background-image:url('images/seb_bg_image2.jpg');
background-repeat:no-repeat;
}
</head>

<body><script language="JavaScript1.2">

/*
Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and TOS, visit http://www.dynamicdrive.com
Credit MUST stay intact
*/

//Specify the marquee's width (in pixels)
var marqueewidth="640px"
//Specify the marquee's height
var marqueeheight="165px"
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=1
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=1

//Specify the marquee's content
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

var marqueecontent='<font face="Verdana"color="#FF99CC"><p><br><p><br><p><br >Text text text text text text text text text text text text text text text text text text etc, etc....<p><br><br></font>'

////NO NEED TO EDIT BELOW THIS LINE////////////

marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
var actualheight=''
var cross_marquee, ns_marquee

function populate(){
if (iedom){
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee.style.top=parseInt(marqueeheight)+8+ "px"
cross_marquee.innerHTML=marqueecontent
actualheight=cross_marquee.offsetHeight
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee 2
ns_marquee.top=parseInt(marqueeheight)+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualheight=ns_marquee.document.height
}
lefttime=setInterval("scrollmarquee()",20)
}
window.onload=populate

function scrollmarquee(){

if (iedom){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
cross_marquee.style.top=parseInt(cross_marquee.sty le.top)-copyspeed+"px"
else
cross_marquee.style.top=parseInt(marqueeheight)+8+ "px"
}
else if (document.layers){
if (ns_marquee.top>(actualheight*(-1)+8))
ns_marquee.top-=copyspeed
else
ns_marquee.top=parseInt(marqueeheight)+8
}
}

if (iedom||document.layers){
with (document){
if (iedom){
write('<div style="position:relative;width:'+marqueewidth+';he ight:'+marqueeheight+';overflow:hidden" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0px;top:0px;width:10 0%;">')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee">')
write('<layer name="ns_marquee2" width='+marqueewidth+' height='+marqueeheight+' left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
}
}
</script>

Hoping someone can help!

**techwench** · 10-01-2003, 11:48 AM

Quote:

<head>
<p><br>
<style type="text/css">
a:link {color: #FF99CC}
a:visited {color: #FF99CC}
a:hover {color: #FFFFFF}
a:active {color: #FFFFFF}
</style>
<style type="text/css">

</style
BODY {
background-image:url('images/seb_bg_image2.jpg');
background-repeat:no-repeat;
}
</head>

Replace the entire section above with the following:

Code:

<head>
<STYLE TYPE="text/css">
<!--
   BODY {
          background-image:url('images/seb_bg_image2.jpg');
          background-repeat:no-repeat; 
        }
   A {text-decoration:none;}
   A:link,A:visited  {color: #FF99CC;}
   A:hover,A:active  {color: #FFFFFF;}
//-->
</STYLE>
</head>

Moving on...

Okay...did you actually delete the image? Or did you just remove the reference from your background properties (in your BODY tag)? If you actually deleted the image, it won't show up because the image isn't there anymore.

I don't know how your host works, and how the pages are edited through their editor, but you have to make sure the image is on your server, make sure it is not referenced in your <BODY> tag, and make sure it is pointing to the correct path of that image within the <STYLE> tag.

**brit** · 10-01-2003, 02:38 PM

Ok, it seems to be working fine now, though only by me keeping in the host's background image fucntion, and not removing it first. ("If your page editor has a separate funtion to insert the background image into your site, take it out, and use the style tag I posted above. Put it on a line just before the </HEAD> tag").
What I was doing before, was inserting your code after I removed that function... I popped the function back in with your code and its ok. For some reason, that is the only way it will work.

There is no tiling to the right of my screen as before, though still a little line at the bottom where the picture is cut off... presumably it is just the image's size when it was loaded, as the tiling has disappeared everywhere else on screen.

I will post the new link at a later link just to make sure noone else sees tiling! I am still designing it for 800x600 though. I am able to view in both on my computer (800x600,1024x728) though I much prefer the first. The 1024x728 is a little small in font.

Thanks so much for the help - much appreciated!
Brit