Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

HTML Marquee Tag - Continuous Scrolling

Posted on 2014-01-21
2
Medium Priority
?
1,271 Views
Last Modified: 2014-01-29
Hello Experts,

I am working with the following HTML code and currently the marquee is working great with the exception that the marquee will not "start-up" again til after the last image has made it completely off the screen. Is there anyway without using javascript that will make the scrolling effect continuous so that the first image will appear before the last one has completely left the screen?

<div class="bp_scroll" style="background-color:#ffffff;">
    
	<marquee behavior="scroll" direction="right">
	
	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>
	
	</marquee>
</div>

Open in new window

0
Comment
Question by:robthomas09
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39798323
Apart from the fact that Marquee is obsolete and was really only an IE thing (first time I have heard it mentioned in a decade) what you are asking for is not possible, you would need a javascript implementation.

edit
I tell a lie it is now in CSS3 but doesn't seem to be recognised by all browsers, still not valid HTML
0
 
LVL 16

Accepted Solution

by:
hankknight earned 1500 total points
ID: 39799981
Here are the pure CSS options available to you:
http://www.w3schools.com/cssref/default.asp?utm_source=twitterfeed&utm_medium=twitter

There is no good way without the use of Javascript to make it loop seamlessly the way you want however you could repeat the content 100 times.  For example:
<div class="bp_scroll" style="background-color:#ffffff;">
    
	<marquee behavior="scroll" direction="right">
	
	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>

	<a href="http://www.anderscpa.com/industries/health-care/" title="Anders" target="_blank">
	<img alt="Anders" src="/resource/resmgr/bp_logos/anders_healthcare-08.jpg" style="" align="left" height="76px" width="150px" />
	</a>
	
	<a href="http://www.curas.net/" title="Curas, Inc" target="_blank">
	<img alt="Curas, Inc" title="Curas, Inc" src="/resource/resmgr/bp_logos/curas_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.enterprisebank.com" title="Enterprise Bank" target="_blank">
	<img alt="Enterprise Bank" title="Enterprise Bank" src="/resource/resmgr/bp_logos/enterprise_homepage_image_15.jpg" align="left" />
	</a>
	
	<a href="http://www.medicusins.com/" title="Medicus Insurance" target="_blank">
	<img alt="Medicus" title="Medicus" src="/resource/resmgr/bp_logos/medicus_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.mpmins.com" title="Missouri Professional Mutual" target="_blank">
	<img alt="MPM" title="MPM" src="/resource/resmgr/bp_logos/mpm_homepage_image_150.jpg" align="left" />
	</a>
	
	<a href="http://www.signaturehealth.net" title="Signature Medical Group" target="_blank">
	<img alt="Signature Medical Group" title="Signature Medical Group" src="https://mgmastl.site-ym.com/resource/resmgr/bp_logos/signature_homepage_image_150.jpg" align="left" />
	</a>
	
	</marquee>
</div>

Open in new window

0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
CTAs encourage people to do something specific to show interest in your company, product or service. Keep reading to learn why CTAs should always be thought of as extremely important, albeit small, sections of websites.
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question