running text
Moderator: Tata
running text
is there a plugin in CMSimple _XH that can ensure that you get a line with a “running text" from, for example, left to right for each page?
Rob Zeijen,
Valkenswaard (NL)
Valkenswaard (NL)
Re: running text
There used to be a plugin from simplesolutions.dk – but I can't find it anymore.
But, you can also solve this simply with CSS.
Create some new rules in the template stylesheet (stylesheet.css):
If you want to have the scrolling text on all pages, then add it at the appropriate place in template.htm:
“Lorem ipsum …” That is your text.
If you want to have the ticker only on certain pages, then you can also insert this line in the source code of the editor. This way you can also insert a different ticker on each page.
If you want the text to run from right to left, remove the word “reverse” from the animation.
Of course, you can also customize the “div.marquee” (background color, borders, etc.).
But, you can also solve this simply with CSS.
Create some new rules in the template stylesheet (stylesheet.css):
Code: Select all
@keyframes marquee {
0% { text-indent: 100% }
100% { text-indent: -100% }
}
div.marquee {
width: 100%;
margin: auto;
padding: 2px;
overflow: hidden;
white-space: nowrap;
animation: marquee 20s reverse linear infinite;
}
div.marquee:hover {
animation-play-state: paused;
cursor: not-allowed;
}
Code: Select all
<div class="marquee">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque cursus, mauris nec sagittis dictum.</div>
If you want to have the ticker only on certain pages, then you can also insert this line in the source code of the editor. This way you can also insert a different ticker on each page.
If you want the text to run from right to left, remove the word “reverse” from the animation.
Code: Select all
animation: marquee 20s linear infinite;
Re: running text
frase,
Thank you very much.
I now have a line on each page. The only thing: its not "running" . See the marked line:
www.podologiedommelen.nl
Thank you very much.
I now have a line on each page. The only thing: its not "running" . See the marked line:
www.podologiedommelen.nl
You do not have the required permissions to view the files attached to this post.
Rob Zeijen,
Valkenswaard (NL)
Valkenswaard (NL)
Re: running text
This is because the new rules are commented out in stylesheet.css.
Above the new rules, remove the two lines:
Code: Select all
/*
/*
Re: running text
Thanks.
In Chrome, Edge, Firefoxit is running now. In Safari it doesn't run.
www.podologiedommelen.nl
In Chrome, Edge, Firefoxit is running now. In Safari it doesn't run.
www.podologiedommelen.nl
Rob Zeijen,
Valkenswaard (NL)
Valkenswaard (NL)
Re: running text
Unfortunately, I can't test this with Safari.
But you can try with vendor specific CSS.
Just add the following to the new rule:
Code: Select all
@-webkit-keyframes marquee {
0% { text-indent: 100% }
100% { text-indent: -100% }
}
div.marquee {
max-width: 100vw;
-webkit-animation: marquee 20s linear infinite;
}
div.marquee:hover {
-webkit-animation-play-state: paused;
}
If you have tried it, please give the result.
Re: running text
The animation works in Safari but the text starts split in two lines (in another browsers as well). I have not think about where to add the necessary value.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
Re: running text
This should not actually happen.
“white-space: nowrap;” should ensure that no line breaks occur.
For me, there are no line breaks in any browser.
The three new rules (for Safari) are to be added in addition to the other new rules.
Re: running text
The NewsPlugin by knollsen includes NewsTicker, NewsSlider and NewsScroller. Probably a bit overkill for your purposes, but check it out.
Download page here. Password can be found here.
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“ Ludwig's XH-Templates for MultiPage & OnePage
Re: running text
Anyway: But the "white-space: nowrap;” has solved it.
THX
You do not have the required permissions to view the files attached to this post.
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.