FROM CACHE - fr_header

Barre d'informations dynamiques

Barre d'informations dynamiques

cdevl3749
Voyageur
24 0 0

Bonjour,

J'ai intégrer sur mon thème SIMPLE une barre d'information avec textes dynamiques et j'aurais voulu que mon texte qui défile sur Mobile ne fasse pas un retour chariot, que le texte qui défile reste fixe.

Pouvez vous m'aider ? ( je pense que c'est un paramètres à changer au niveau CSS ? ).

Voici le code source : theme.scss.liquid

.dynamic-headline {
 font-size:16px;
 font-weight:bold;
 color:#333;
 background:#f0f0f0;
 position: relative;
 top:0;
 line-height: 35px;
 text-align: center;
 width: 100%;
 left:0;
 z-index:99999;
 right:0;
}
.dynamic-headline .change {
 color:#ff6600;
}
.dynamic-headline .typed-cursor {
 color:#ff6600;
 font-weight: 300;
}
@media screen and (max-width: 800px) {
 .dynamic-headline { 
 font-size:15px; 
 line-height: 18px;
 padding:5px 0;
 position:relative;
 top:auto; 
 left:auto;
 right:auto;
 }
}

 

Code JS : theme.js.liquid

// nombre de phrases souhaitées - choix entre 3 et 6 maximum
dynamicWordNumber = 3;
dynamicWord1 = "des prix attractifs !";
// 2ere phrase
dynamicWord2 = "la livraison gratuite !";
// 3ere phrase
dynamicWord3 = "une garantie satisfait ou remboursé !";
// 4ere phrase
dynamicWord4 = "un service après vente de qualité !";
// 4ere phrase
dynamicWord5 = "etc..";
// 4ere phrase
dynamicWord6 = "etc";
// ne pas toucher
!function(t){"use strict";var s=function(s,e){this.el=t(s),this.options=t.extend({},t.fn.typed.defaults,e),this.text=this.el.text(),this.typeSpeed=this.options.typeSpeed,this.startDelay=this.options.startDelay,this.backSpeed=this.options.backSpeed,this.backDelay=this.options.backDelay,this.strings=this.options.strings,this.strPos=0,this.arrayPos=0,this.stopNum=0,this.loop=this.options.loop,this.loopCount=this.options.loopCount,this.curLoop=0,this.stop=!1,this.build()};s.prototype={constructor:s,init:function(){var t=this;t.timeout=setTimeout(function(){t.typewrite(t.strings[t.arrayPos],t.strPos)},t.startDelay)},build:function(){this.cursor=t('<span class="typed-cursor">|</span>'),this.el.after(this.cursor),this.init()},typewrite:function(t,s){if(!0!==this.stop){var e=Math.round(70*Math.random())+this.typeSpeed,o=this;o.timeout=setTimeout(function(){var e=0,i=t.substr(s);if("^"===i.charAt(0)){var n=1;i.match(/^\^\d+/)&&(n+=(i=i.replace(/^\^(\d+).*/,"$1")).length,e=parseInt(i)),t=t.substring(0,s)+t.substring(s+n)}o.timeout=setTimeout(function(){if(s===t.length){if(o.options.onStringTyped(o.arrayPos),o.arrayPos===o.strings.length-1&&(o.options.callback(),o.curLoop++,!1===o.loop||o.curLoop===o.loopCount))return;o.timeout=setTimeout(function(){o.backspace(t,s)},o.backDelay)}else 0===s&&o.options.preStringTyped(o.arrayPos),o.el.text(o.text+t.substr(0,s+1)),s++,o.typewrite(t,s)},e)},e)}},backspace:function(t,s){if(!0!==this.stop){var e=Math.round(70*Math.random())+this.backSpeed,o=this;o.timeout=setTimeout(function(){o.el.text(o.text+t.substr(0,s)),s>o.stopNum?(s--,o.backspace(t,s)):s<=o.stopNum&&(o.arrayPos++,o.arrayPos===o.strings.length?(o.arrayPos=0,o.init()):o.typewrite(o.strings[o.arrayPos],s))},e)}},reset:function(){clearInterval(this.timeout);var t=this.el.attr("id");this.el.after('<span id="'+t+'"/>'),this.el.remove(),this.cursor.remove(),this.options.resetCallback()}},t.fn.typed=function(e){return this.each(function(){var o=t(this),i=o.data("typed"),n="object"==typeof e&&e;i||o.data("typed",i=new s(this,n)),"string"==typeof e&&i[e]()})},t.fn.typed.defaults={strings:["These are the default values...","You know what you should do?","Use your own!","Have a great day!"],typeSpeed:0,startDelay:0,backSpeed:0,backDelay:500,loop:!1,loopCount:!1,callback:function(){},preStringTyped:function(){},onStringTyped:function(){},resetCallback:function(){}}}(window.jQuery);
// script génére
if(dynamicWordNumber == 3) {
$(function(){
 $(".change").typed({
 strings: [dynamicWord1, dynamicWord2, dynamicWord3],
 loop: true,
 backDelay: 300,
 typeSpeed: 70
 });
});
}
if(dynamicWordNumber == 4) {
$(function(){
 $(".change").typed({
 strings: [dynamicWord1, dynamicWord2, dynamicWord3, dynamicWord4],
 loop: true,
 backDelay: 300,
 typeSpeed: 70
 });
});
}
if(dynamicWordNumber == 5) {
$(function(){
 $(".change").typed({
 strings: [dynamicWord1, dynamicWord2, dynamicWord3, dynamicWord4, dynamicWord5],
 loop: true,
 backDelay: 300,
 typeSpeed: 70
 });
});
}
if(dynamicWordNumber == 6) {
$(function(){
 $(".change").typed({
 strings: [dynamicWord1, dynamicWord2, dynamicWord3, dynamicWord4, dynamicWord5, dynamicWord6],
 loop: true,
 backDelay: 300,
 typeSpeed: 70
 });
});
}

 

0 RÉPONSES 0