Link to home
Start Free TrialLog in
Avatar of Minh Nguyen
Minh Nguyen

asked on

Are we able to Fix Position HTML Text on Top and make it Run from Right to Left

Hello,
Appreciate your help.

I have a question about websites which are in mobile version. My experience in this aspect is quite less.
Please confirm whether we can fix the position of the HTML text line on the top of the web page, and still keep that line running from the right to the left side (using <marquee> tag) at the same time.
Please let me know if we have another way (some JS for example) to do this task without using the <marquee> tag.

Thanks in advanced.

I am available from 08:30 to 22:00, GMT +7.
Avatar of lenamtl
lenamtl
Flag of Canada image

Hi,

The HTML <marquee> element is now obsolete
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/marquee

I usually use Animate
https://daneden.github.io/animate.css/ 
and https://animejs.com/


You could use something like this
http://jsfiddle.net/lenamtl/gr4fLt5d/
Avatar of Minh Nguyen
Minh Nguyen

ASKER

Hi Nam,
Thank you for the information!

However, I still want to know whether we can apply the sliding text effect ( http://jsfiddle.net/lenamtl/gr4fLt5d/ ) as well as fixing the position of that text, so it can always be on top of the web page, no matter how much we scroll the page down.

For example, the below screenshot shows the fixed position of the text "Some text here" which I want:
User generated image
Nevertheless, "Some text here" will be disappear when I scroll the page down to see remaining content of the web page:
User generated image
Is there any way to make "Some text here" still be on top, and also still slide from right to left?
Please note that the web page will be displayed on Mobile.
Hi,
you can use Bootstrap to have mobile / tablet /desktop view and place your code into a div.

there are several way to do it
you can use
float : https://getbootstrap.com/docs/4.0/utilities/float/
Position: https://getbootstrap.com/docs/4.0/utilities/position/
Z-index can be use so your div won't hide another div : https://getbootstrap.com/docs/4.0/layout/overview/#z-index
Display : https://getbootstrap.com/docs/4.0/utilities/display/

You have some example with sticky items
https://getbootstrap.com/docs/4.0/examples/

To save a lot of time I would recommend to use a template ready to use, most of them have menu with top menu (so you can place your marque on top of your menu. Most of them have sticky item, sticky menu and footer

All these required some calculation and these template have all this ready for you at very low price
You can ask author if your are not sure before to buy
https://themeforest.net/tags/bootstrap
Thank you Nam,
Actually, I am not the one who directly develop the website. My role is pointing out what should be done to the website by the web development team. They are using ASP.NET, and I don't think Bootstrap is being used.
Thus, the website looks cheap and ugly.

Appreciate if you can show exactly how to do my requirements without using Bootstrap. That is the reason why I come here.
If you are not able, please don't worry cause I think I will figure it out. Although it may take time.
Thank you once again for your help till now!
Have a nice day!
ASKER CERTIFIED SOLUTION
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Thank you