marquee tag

**phphelp** · Jun 29, 2005 01:25

hi
i wan tto know how can i make marquee like this that it will not end means if its direction is up then it will continously go no gap between first and last filed.
e.g i have 'first','second','third' in marquee.so when they are scrolling after 'third' thier comes soem gap then again 'first' comes how can i finish this gap??

**BluDragon** · Jun 29, 2005 02:17

Even though I can't understand your post (someone please translate to english), I will tell that using the "<marquee>" certaintly is not a good idea! It's a propriety IE piece of crap that tends to annoy everyone. Don't think you're gonna get away with the "<blink>" tag either...

**ashasachdeva** · Jun 29, 2005 03:25

As far as i understood ur problem!!

Please try this...

html:

<div id="subHeading">Current News</div>
<div id="box"><marquee scrollamount="2" direction="up" loop="true" class="maqHeight"><span class="bold">Rejects

/span><br />In another development," Rumsfeld said.Source: China Daily</marquee></div>

css:
body {
margin:30px 50px 50px 120px;
font-family:Verdana, sans-serif;
background:#666666;
color:#000000;
}
#subHeading{
padding:5px 0px 5px 0px;
border:2px solid #333399;
background:#FFFFFF;
font-weight:bold;
color:#0000CC;
text-align:center;
}

#box{
padding:8px 8px 8px 5px;
text-align:center;
border-right:2px solid #333399;
border-bottom:2px solid #333399;
border-left:2px solid #333399;
background:#FFFFFF;
color:#999999;
font-size:.8em;
height:10px;
}

take care
ash

**coothead** · Jun 29, 2005 11:10

Hi there phphelp,

not possible with the marquee element.

Have a look at this simple javascript working example...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>floating clouds</title>

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<base href="http://achelous.mysite.wanadoo-members.co.uk/"/>

<style type="text/css">
/*<![CDATA[*/
body {
     margin:10px 0px;
     padding:0px;
     background-color:#666;
}
#scroller {
     width:100%;
     height:125px; 
     background:url(floating_clouds.jpg) repeat-x; 
     border-top:1px solid #000;
     border-bottom:1px solid #000;
}
/*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[

  var speed=25;
function scroller(x) {

     document.getElementById("scroller").style.backgroundPosition=x+"px 0px";
 
setTimeout("scroller("+(x-1)+")",speed);      /*change (x-1) to (x+1) for direction change.*/
}

//]]>
</script>

</head>
<body onload="scroller(0)">

<div id="scroller"></div> 

</body>
</html>

coothead

**phphelp** · Jun 30, 2005 01:23

thats great 'coothead'.but hoiw can i implement this for scrolling news going form down to up????? or anyother javascript code?????

**coothead** · Jun 30, 2005 07:48

Hi there phphelp,

try this, it may give you some ideas...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>scrolling text</title>

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<style type="text/css">
/*<![CDATA[*/

body {
     background-color: #666;
     margin:0px;
     padding:0px;
 }
#container {
     width: 340px;
     height: 341px;
     position: absolute;
     left: 200px;;
     top: 100px;
     overflow: hidden;
     background-color:#fff;
     border:6px inset #666;
 }
#text0,#text1 {
     position: absolute;
     width: 300px;
     padding:10px 20px;
     font-family: verdana,arial,helvetica,sans-serif;
     font-size:14px;
     color:#666;
     text-align: justify;
 }

/*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[

  var i = 0;
  var j=341
  var speed = 25;
 
function imgScroll() {

     document.getElementById("text0").style.top = i + "px";
     document.getElementById("text1").style.top = j + "px";
      
  i--;
  j--;

if( i<-340) {
  i = 341;
 }

if( j<-340) {
  j = 341;
 }
 
  scroller=setTimeout("imgScroll()",speed);
}

  onload = imgScroll;

//]]>
</script>

</head>
<body>

<div id = "container">

<div id="text0">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent blandit venenatis purus. 
Integer massa libero, vehicula id, consequat sed, tincidunt nec, purus. Class aptent taciti 
sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Suspendisse 
potenti. Nunc vulputate magna non magna. Aenean lorem eros, adipiscing quis, semper non, 
dictum a, nunc. Curabitur ut sem. Pellentesque a est id neque hendrerit ultrices. Donec 
vulputate tincidunt turpis. Curabitur dignissim vestibulum nunc. Aliquam felis lorem, ultrices 
sit amet, convallis a, accumsan vel, ante. Proin aliquam turpis sed augue. In pellentesque, 
magna a pulvinar adipiscing, est orci adipiscing felis, sed laoreet urna magna quis neque. 
Proin facilisis aliquet urna.
</div>
<div id="text1">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent blandit venenatis purus. 
Integer massa libero, vehicula id, consequat sed, tincidunt nec, purus. Class aptent taciti 
sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Suspendisse 
potenti. Nunc vulputate magna non magna. Aenean lorem eros, adipiscing quis, semper non, 
dictum a, nunc. Curabitur ut sem. Pellentesque a est id neque hendrerit ultrices. Donec 
vulputate tincidunt turpis. Curabitur dignissim vestibulum nunc. Aliquam felis lorem, ultrices 
sit amet, convallis a, accumsan vel, ante. Proin aliquam turpis sed augue. In pellentesque, 
magna a pulvinar adipiscing, est orci adipiscing felis, sed laoreet urna magna quis neque. 
Proin facilisis aliquet urna.
</div>

</div>

</body>
</html>

coothead

**kingaudio.co.uk** · Jul 24, 2005 06:28

Transcription and Typing

Hi. I've got a marquee tag in an HTML document but upon W3C compliance test, it is coming up as an error. I have got my doctype as:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

Any ideas on a really simple way of getting this marquee to comply? Apart from removing it altogether.
Cheers

Originally Posted by coothead

Hi there phphelp,

not possible with the marquee element.

Have a look at this simple javascript working example...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>floating clouds</title>

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<base href="http://achelous.mysite.wanadoo-members.co.uk/"/>

<style type="text/css">
/*<![CDATA[*/
body {
     margin:10px 0px;
     padding:0px;
     background-color:#666;
}
#scroller {
     width:100%;
     height:125px; 
     background:url(floating_clouds.jpg) repeat-x; 
     border-top:1px solid #000;
     border-bottom:1px solid #000;
}
/*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[

  var speed=25;
function scroller(x) {

     document.getElementById("scroller").style.backgroundPosition=x+"px 0px";
 
setTimeout("scroller("+(x-1)+")",speed);      /*change (x-1) to (x+1) for direction change.*/
}

//]]>
</script>

</head>
<body onload="scroller(0)">

<div id="scroller"></div> 

</body>
</html>

coothead

**Mittineague** · Jul 24, 2005 07:22

The marquee tag is NOT part of the HTML definition and will cause a validation error (and accessability issues). If you must, try using the js as described previously.

**kingaudio.co.uk** · Jul 24, 2005 10:31

Transcription and Typing

Thank you Mittineague, and the Thomas Edison quote is so true. I've been messing about all day trying to get this W3C compliancy thing right and have given up. Seems the whole page has issues and I've had it for now.
Cheers

User Tag List

Thread: marquee tag

Thread Tools

Display

marquee tag

Marquee tag

Marquee tag

Bookmarks

Bookmarks

Posting Permissions