?
Solved

Vertically scroll text over a div that has a background - like movie credits

Posted on 2010-09-18
4
Medium Priority
?
448 Views
Last Modified: 2013-11-19
I have a large div on a page, enclosed in a table. The div has a background image. That div is also used as a placeholder for some AJAX supplied content.

When it is not showing the AJAX content, I'd like to have some copy scrolling over it, like movie credits. I need the existing background image to show behind the scrolling text. I'd like the text to stop scrolling on mouseover, and the text to be live links to expanded content. I'd like the scolling to be continuous, and to automatically start over once completed

I also need it to be cross browser compantible, and not use Flash. (I want too much!)

Is this possible?

I am working with PHP, JavaScript and j!Query on this page.


0
Comment
Question by:birwin
[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
  • 2
4 Comments
 
LVL 5

Accepted Solution

by:
bupper earned 2000 total points
ID: 33710333
No, you don't want too much, and it is very possible and doable. I will not write the script, but I will walk you through the steps:

On the main div with the background, make sure you have css "overflow:hidden"
You create a child div, and specify position:absolute, besides other formatting options.
The child div should have an ID, like "childabc"
specify onmouseover and onmouseout in the child div, this will set a javascript variable so js knows whether the mouse is over or not. As you will see below, the onmouseout should also trigger the main function:
Write a javascript function. It will move the child div. You can do it like, document.getElementById("childabc").style.top = NEWTOP; (this will be a variable; 0 = beginning, CHILDDIV.offsetHeight-MAINDIV.offsetHeight = end)
At the end of the javascript function call setTimeout to redo the function, IF the mouse is not over the child div.

I know, I know it's a lot of content there, but that's it in a nutshell. If you want to research each point, go ahead :) It will work, btw, and be completely cross-browser.
0
 
LVL 6

Author Comment

by:birwin
ID: 33713347
Sorry, I am not enough of a JavaScript coder to be able to do that. (I'm mostly a PHP/mySQL coder).
0
 
LVL 5

Expert Comment

by:bupper
ID: 33717570
Then hire a developer or learn it :)

If you Google each point, it will be simple enough.
0
 
LVL 6

Author Closing Comment

by:birwin
ID: 33818642
I usually use the PHP section, where posters are polite, helpful, and not as stingy with their knowledge. I guess JavaScript programmers, or at least you, are a different breed. But to close this question, you get the points.

Please choke on them.
0

Featured Post

Docker-Compose to Simplify Multi-Container Builds

Our veteran DevOps Author takes you through how to build a multi-container environment, managed with a single utility in order to simplify your deployments.

Question has a verified solution.

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

Preface This is the third article about the EE Collaborative Login Project. A Better Website Login System (http://www.experts-exchange.com/A_2902.html) introduces the Login System and shows how to implement a login page. The EE Collaborative Logi…
Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Viewers will learn about basic arrays, how to declare them, and how to use them. Introduction and definition: Declare an array and cover the syntax of declaring them: Initialize every index in the created array: Example/Features of a basic arr…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses

762 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