inline animation
Hoi
Kan je animatie via inline style maken? Indien ja graag hoe.
Ik zou graag een animatie style toevoegen aan ckeditor en dat werkt met inline style.
Jan
Mijn toevoeging in css
Kan je animatie via inline style maken? Indien ja graag hoe.
Ik zou graag een animatie style toevoegen aan ckeditor en dat werkt met inline style.
Jan
Mijn toevoeging in css
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
.kleurlicht {
animation: blinker 1s linear infinite;
animation: regenboogAni 1s linear infinite;
text-align:center;
text-transform:uppercase;
}
@keyframes blinker {
50% { opacity: 0.0; }
}
@keyframes regenboogAni {
0% {background: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);}
14% {background: -webkit-linear-gradient(left, violet, red, orange, yellow, green, blue, indigo);}
28% {background: -webkit-linear-gradient(left, indigo, violet, red, orange, yellow, green, blue);}
43% {background: -webkit-linear-gradient(left, blue, indigo, violet, red, orange, yellow, green);}
57% {background: -webkit-linear-gradient(left, green, blue, indigo, violet, red, orange, yellow);}
71% {background: -webkit-linear-gradient(left, yellow, green, blue, indigo, violet, red, orange);}
86% {background: -webkit-linear-gradient(left, orange, yellow, green, blue, indigo, violet, red);}
100% {background: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);}
}
animation: blinker 1s linear infinite;
animation: regenboogAni 1s linear infinite;
text-align:center;
text-transform:uppercase;
}
@keyframes blinker {
50% { opacity: 0.0; }
}
@keyframes regenboogAni {
0% {background: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);}
14% {background: -webkit-linear-gradient(left, violet, red, orange, yellow, green, blue, indigo);}
28% {background: -webkit-linear-gradient(left, indigo, violet, red, orange, yellow, green, blue);}
43% {background: -webkit-linear-gradient(left, blue, indigo, violet, red, orange, yellow, green);}
57% {background: -webkit-linear-gradient(left, green, blue, indigo, violet, red, orange, yellow);}
71% {background: -webkit-linear-gradient(left, yellow, green, blue, indigo, violet, red, orange);}
86% {background: -webkit-linear-gradient(left, orange, yellow, green, blue, indigo, violet, red);}
100% {background: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);}
}
Je kan met CKeditor ook je HTML-code aanpassen hoor. Voor versie 5 moet je daarvoor een plug-in downloaden.
OK. Weet ik maar daarmee heb ik nog geen nieuwe style.
Kan je niet de line-breaks en spaties strippen? Mogelijk werkt het dan gewoon.
Het probleem is niet de gewone css maar de animatie. Die pakt blijkbaar niet.
Als ik zo op SO lees (https://stackoverflow.com/questions/6510094/can-you-change-css3-animation-keyframe-attributes-inline-i-e-in-the-html-style), dan moet ik je toch teleurstellen...
Sowieso is in-line styling toch iets wat je moet vermijden.
Quote:
No. since the animation is not declared in the element, it's only called upon it. It's like trying to add methods into an object instead of to a class. Not possible, sorry ;)
Sowieso is in-line styling toch iets wat je moet vermijden.
Daar vreesde ik al voor. Als oplossing heb ik de de style ingevoerd maar de animatie staat de css.
Nadeel is dat het in de editor niet te zien is maar toch in het resultaat.
Ik heb geen keuze dan werken met een oplossing zoals cke omdat de teksten bewerkbaar moeten zijn en inbrengbaar door digileken.
Toch bedankt om mee te denken.
Jan
Nadeel is dat het in de editor niet te zien is maar toch in het resultaat.
Ik heb geen keuze dan werken met een oplossing zoals cke omdat de teksten bewerkbaar moeten zijn en inbrengbaar door digileken.
Toch bedankt om mee te denken.
Jan
Als je jouw applicatie kan aanpassen, dan kan je een veld aanmaken waarin je de CSS-stijl kan toevoegen.
Uiteraard zet je erbij dat dit 'enkel bedoeld is voor gebruikers met CSS-kennis'. In CKeditor weet ik dat je ook ID's en classes kan toevoegen aan elementen.
Uiteraard zet je erbij dat dit 'enkel bedoeld is voor gebruikers met CSS-kennis'. In CKeditor weet ik dat je ook ID's en classes kan toevoegen aan elementen.
Dat is dus een probleem ze kunnen nog niet deftig werken met Windows laat staan html/css
Ik weet niet precies wat je wilt bereiken, dus wellicht slaat hetgeen ik nu zeg nergens op.
Kun je het niet zomaken dat ze (de digileken) sterretjes om de tekst zetten die moet 'blinken'.
Op het moment dat je de tekst toont, vervang je de eerste *** door: <span class="kleurlicht">
En de tweede *** vervang je door </span>
Kun je het niet zomaken dat ze (de digileken) sterretjes om de tekst zetten die moet 'blinken'.
Code (php)
1
Bla bla bla. Dit is de tekst die de digileken invoeren. ***Deze tekst blinkt.*** En deze tekst is weer normaal.
Op het moment dat je de tekst toont, vervang je de eerste *** door: <span class="kleurlicht">
En de tweede *** vervang je door </span>
Jan R op 29/10/2021 07:23:44:
Dat is dus een probleem ze kunnen nog niet deftig werken met Windows laat staan html/css
Dat is toch niet verplicht. Dan moeten ze die velden niet invullen. :-P
Dan verbergt je dit veld tot ze naar een 'advanced lay-out' overklikken. Of je verwerkt dit in een rechtensysteem. Maar UBB vind ik ook wel een handige oplossing. Ikzelf gebruik NBBC. Je kan zelf ook uitgebreid en eenvoudig tags maken.
Gewijzigd op 29/10/2021 13:22:50 door - Ariën -




