{up marquee=label} texte du message défilant {/up marquee}- marquee: le texte de l'etiquette
- height (h,hauteur)=100px: hauteur defaut pour scroll vetical
- model=base: style CSS dans .upmq-*style*. aucun=none
- out-class: classe(s) pour div out
- out-style: style inline pour div out
- msg-class: classe(s) pour div msg
- msg-style: style inline pour div msg
- lbl-class: classe(s) pour div label
- lbl-style: style inline pour div label
- lbl-pos: position label : left, right, up, down, none
- lbl-nowrap=false: true = label sur une ligne
- direction=left: right, up, down
- loop=-1: nombre d'affichage, -1 : infini
- scrolldelay=0: delai en millisecondes
- scrollamount=50: vitesse
- circular=true: mode carousel. si contenu plus large que .str_wrap
- drag=true: deplacement msg avec souris
- runshort=true: scroll si texte court (visible sans scroll)
- hoverstop=true: pause lors survol
- inverthover=false: scroll uniquement lors survol
Sur un script de script JS limarquee de omcg33 (licence MIT)
Syntaxe minimale
{up marquee}le texte défilant{ /up marquee}Les modèles fournis avec le plugin
info-img
{up marquee | model=info-img | lbl-pos=left }
<strong style="font-size:24px">le texte défilant</strong>
{/up marquee}Attention: pour afficher la zone label en l'absence d'un titre, il faut indiquer sa position par lbl-pos
info
{up marquee=infos | lbl-pos=right | model=info | lbl-style=color:yellow}le texte défilant{/up marquee}ok
{up marquee=infos| lbl-pos=right | model=ok | lbl-style=color:yellow}
<strong style="color: red;">le texte défilant</strong>
{/up marquee}cahier
{up marquee=une demo de défilement vertical | direction=up
| model=cahier | inverthover
| H=300px | lbl-nowrap | circular=0
| out-class=ombre
| out-style=border:#aaa 1px solid; margin-top:10px
}
<p>{up lorem}</p>
<p>{up lorempixel=cats | h=100 | L=800}</p>
<p>{up lorem=decorate,link,ul}</p>
{/up marquee}inverthover fait que le texte défile uniquement lors du survol par la souris. lbl-nowrap empêche les retours à la ligne pour le libellé
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Is ita vivebat, ut nulla tam exquisita posset inveniri voluptas, qua non abundaret. Duarum enim vitarum nobis erunt instituta capienda. Cur deinde Metrodori liberos commendas?
Tecum optime, deinde etiam cum mediocri amico. An nisi populari fama? Non autem hoc: igitur ne illud quidem. Quid affers, cur Thorius, cur Caius Postumius, cur omnium horum magister, Orata, non iucundissime vixerit? Nam illud vehementer repugnat, eundem beatum esse et multis malis oppressum. Deinde prima illa, quae in congressu solemus: Quid tu, inquit, huc?
Mihi enim satis est, ipsis non satis. Ergo ita: non posse honeste vivi, nisi honeste vivatur?
Duo Reges: constructio interrete. Ita nemo beato beatior. Non igitur de improbo, sed de callido improbo quaerimus, qualis Q. Teneo, inquit, finem illi videri nihil dolere. Non modo carum sibi quemque, verum etiam vehementer carum esse? Inde igitur, inquit, ordiendum est. At hoc in eo M. Summus dolor plures dies manere non potest? Utinam quidem dicerent alium alio beatiorem! Iam ruinas videres. Tum Piso: Quoniam igitur aliquid omnes, quid Lucius noster?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Si ad corpus pertinentibus, rationes tuas te video compensare cum istis doloribus, non memoriam corpore perceptarum voluptatum; Certe, nisi voluptatem tanti aestimaretis. Sic enim maiores nostri labores non fugiendos tristissimo tamen verbo aerumnas etiam in deo nominaverunt. Utinam quidem dicerent alium alio beatiorem! Iam ruinas videres. Familiares nostros, credo, Sironem dicis et Philodemum, cum optimos viros, tum homines doctissimos. Duo Reges: constructio interrete. Sed ad illum redeo.
- Quid turpius quam sapientis vitam ex insipientium sermone pendere?
- Cum autem venissemus in Academiae non sine causa nobilitata spatia, solitudo erat ea, quam volueramus.
- Quod autem meum munus dicis non equidem recuso, sed te adiungo socium.
- Cum praesertim illa perdiscere ludus esset.
- Potius ergo illa dicantur: turpe esse, viri non esse debilitari dolore, frangi, succumbere.
- Sed in rebus apertissimis nimium longi sumus.
- Itaque nostrum est-quod nostrum dico, artis est-ad ea principia, quae accepimus.
Nam adhuc, meo fortasse vitio, quid ego quaeram non perspicis. Non quam nostram quidem, inquit Pomponius iocans; Aliter enim explicari, quod quaeritur, non potest. Haec quo modo conveniant, non sane intellego. Idcirco enim non desideraret, quia, quod dolore caret, id in voluptate est. Sed plane dicit quod intellegit. Facile est hoc cernere in primis puerorum aetatulis. Nam ante Aristippus, et ille melius. Nec vero intermittunt aut admirationem earum rerum, quae sunt ab antiquis repertae, aut investigationem novarum. Qui non moveatur et offensione turpitudinis et comprobatione honestatis?
Hic nihil fuit, quod quaereremus. Quas enim kakaw Graeci appellant, vitia malo quam malitias nominare. Sed nimis multa. Si longus, levis. Isto modo ne improbos quidem, si essent boni viri. Duarum enim vitarum nobis erunt instituta capienda. Cuius ad naturam apta ratio vera illa et summa lex a philosophis dicitur. Non quam nostram quidem, inquit Pomponius iocans;
Ita multa dicunt, quae vix intellegam. Cave putes quicquam esse verius. Dicam, inquam, et quidem discendi causa magis, quam quo te aut Epicurum reprehensum velim. Hoc est non modo cor non habere, sed ne palatum quidem. Optime, inquam. Nunc omni virtuti vitium contrario nomine opponitur. Quorum sine causa fieri nihil putandum est. Addidisti ad extremum etiam indoctum fuisse.
promo
{ up marquee | model=promo| <span style="color: #800000;">lbl-pos=left</span>}le texte défilant{ /up marquee}Vous pouvez très facilement créer vos modèles en vous inspirant des fichiers css dans /plugins/content/lmup/actions/marquee/styles
Un bandeau déroulant de logos
Cet exemple correspond à un besoin courant: les logos des sponsors. Il est fait sans modèle, juste quelques options pour l'action Marquee.
{up marquee=<img src="images/admin/joomla-logo-32.png" width="32px" height="32px"><br>Mes<br>extensions<br>Joomla!
| lbl-pos=left | height=100px
| out-style=border:2px #069 solid
| lbl-style=background-color:#069;color:#FFF;font-size:12px;padding:0 10px
| msg-style=padding:0}
<div style="height:100px">
<a href="http://lomart.fr/extensions/adminorder" target="_blank"><img src="images/logo-lomart/logo-adminorder.png" alt="adminorder" title="Ordre de tri par défaut des tables articles, plugins, modules et extensions." height="100px" width="100px"></a><!--
--><a href="http://lomart.fr/extensions/bgmax" target="_blank"><img src="images/logo-lomart/logo-bgmax.png" alt="bgmax" title="Facilite la mise en place d'une image de fond pour votre site." width="100px"></a>
</div>
{/up marquee}J'ai surligné dans le code, les difficultés rencontrées.
- Il faut préciser la hauteur des images à la fois pour le script JS, mais également mettre toutes les images dans un bloc avec la hauteur définie. Cela a pour but de réserver la place tant que les images ne sont pas en cache.
- Il faut également que toutes les images soient sur une seule ligne de code pour éviter les espaces entre-elles. Ce problème classique du HTML est résolu en mettant un commentaire pour simuler le saut de ligne.
Mes
extensions
Joomla!
