Question: How to remove gap or space between marquee tags ?
Answer :
<html>
<style type="text/css">
img {
width: 200px;
height: 75px;
}
#marqueecontainer
{
position: relative;
width: 200px; /*marquee width */
height: 200px; /*marquee height */
background-color: white;
overflow: hidden;
border: 3px solid black;
padding: 2px;
padding-left: 4px;
}
</style>
<script type="text/javascript">
var delayTime=5
var marqueeSpeed=2
var pauseTime=1
var copySpeed=marqueeSpeed
var pauseSpeed=(pauseTime==0)? copySpeed: 0
var actualHeight=''
function ScrollMarquee()
{
if (parseInt(crossMarquee.style.top)>((actualHeight / 2)*(-1)+8))
crossMarquee.style.top=parseInt(crossMarquee.style.top)-copySpeed+"px"
else
crossMarquee.style.top=parseInt((marqueeheight - (actualHeight / 2)) / 2)+8 +"px"
}
function InitializeMarquee()
{
crossMarquee=document.getElementById("vmarquee")
crossMarquee.style.top=0
marqueeheight=document.getElementById("marqueecontainer").offsetHeight
actualHeight=crossMarquee.offsetHeight;
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1)
{
crossMarquee.style.height=marqueeheight+"px"
crossMarquee.style.overflow="scroll"
return
}
setTimeout('lefttime=setInterval("ScrollMarquee()",30)', delayTime)
}
if (window.addEventListener)
window.addEventListener("load", InitializeMarquee, false)
else if (window.attachEvent)
window.attachEvent("onload", InitializeMarquee)
else if (document.getElementById)
window.onload=InitializeMarquee
</script>
<div id="marqueecontainer" onMouseover="copySpeed=pauseSpeed" onMouseout="copySpeed=marqueeSpeed">
<div id="vmarquee" style="position: absolute; width: 98%;">
<div id="copy1" style="background: red;">
<div><img src="http://www.activemax.com/wp/wp-content/uploads/2008/10/google_sitemap.gif"></div>
<div><img src="http://ebinture.files.wordpress.com/2008/07/google-mobile-logo-copy.jpg"></div>
<div><img src="http://images4.pocket-lint.com/images/2Mlt/google-chrome-internet-browser-review-0.jpg"></div>
<div><img src="http://images.pcworld.com/news/graphics/165679-google_wave_logo_take2_180.jpg"></div>
<div><img src="http://www.coffeecup.com/images/software/icons/google-sitemapper_4.7.1_win_en.png"></div>
</div>
<div id="copy2" style="background: blue;">
<div><img src="http://www.activemax.com/wp/wp-content/uploads/2008/10/google_sitemap.gif"></div>
<div><img src="http://ebinture.files.wordpress.com/2008/07/google-mobile-logo-copy.jpg"></div>
<div><img src="http://images4.pocket-lint.com/images/2Mlt/google-chrome-internet-browser-review-0.jpg"></div>
<div><img src="http://images.pcworld.com/news/graphics/165679-google_wave_logo_take2_180.jpg"></div>
<div><img src="http://www.coffeecup.com/images/software/icons/google-sitemapper_4.7.1_win_en.png"></div>
</div>
</div>
</div>
</html>
Hope this post will help you,
if yes please put comment below of this page,
Rajesh Singh,
Asp.Net Developer
Indianic Infotech Ltd (India)
rajesh@indianic.com
Subscribe to:
Post Comments
(
Atom
)
No comments :
Post a Comment