AccueilMembres connectés récemment
[BESTOF] [PHPBB3]Compte à rebours hebdomadaire permanent
2 participants
Page 2 sur 3 • Partagez
Page 2 sur 3 • 
1, 2, 3 
- photoclic
-
Lun 2 Déc 2019 - 9:51
Rappel du premier message :
- Version du forum :PhpBB3
- Templates modifiés :oui
- Navigateur :Firefox
Bonjour,
Je cherche à installer en haut de page un compte à rebours permanent.
Il y a ce script sur FA peut-être adaptable: https://forum.forumactif.com/t379157-horloge-compte-a-rebours-sans-personnalisation#3196324
Mais il faudrait toutes les semaines changer la date.
Le but serait d'avoir en permanence une horloge défilante sur une ligne en haut à gauche de la page d'accueil et sur le portail indiquant: "Temps restant pour voter: 2 jours 12:20:50"
Elle démarrerait à 7 jours 00:00:00 le mardi à 0 heure et arriverait à 0 jour 00:00:00 le lundi à minuit.
Et cela de façon permanente.
Merci pour votre aide.
Je cherche à installer en haut de page un compte à rebours permanent.
Il y a ce script sur FA peut-être adaptable: https://forum.forumactif.com/t379157-horloge-compte-a-rebours-sans-personnalisation#3196324
Mais il faudrait toutes les semaines changer la date.
Le but serait d'avoir en permanence une horloge défilante sur une ligne en haut à gauche de la page d'accueil et sur le portail indiquant: "Temps restant pour voter: 2 jours 12:20:50"
Elle démarrerait à 7 jours 00:00:00 le mardi à 0 heure et arriverait à 0 jour 00:00:00 le lundi à minuit.
Et cela de façon permanente.
Merci pour votre aide.
- Milouze14
Fondateur -
Mar 3 Déc 2019 - 15:48
Oki Serge,
alors ce script doit être fonctionnel mon ami:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.
Déposer ceci:
Penser a cliquer sur le bouton
Puis la css :
alors ce script doit être fonctionnel mon ami:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.
Déposer ceci:
- Code:
$(function(){
$(function(){'use strict';
const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
const
ctx = new AudioContext(),
note = ( frequency = 277.18, duration = 1.0, type = "sine" ) => {
let
osc = ctx.createOscillator(),
gainNode = ctx.createGain();
osc.type = type;
osc.connect( gainNode );
osc.frequency.value = frequency;
gainNode.connect( ctx.destination );
osc.start( 0 );
gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
return Promise.resolve( "note" );
};
let
timer = document.querySelector( id ),
duration = moment.duration({
"seconds" : seconds,
"minutes" : minutes,
"hours" : hours,
"days" :days,
"months" : months,
"years" : years
}),
ObjInterval = setInterval( () => {
duration.subtract( interval, "seconds" );
if ( duration.asMilliseconds() > -1 ){
timer.value = "Temps restant pour voter: " +
http://duration.get( "years" ) + " an(s), " +
http://duration.get( "months" ) + " mois, " +
duration.get( "days" ) + " j, " +
duration.get( "hours" ) + " h, " +
duration.get( "minutes" ) + " mn, " +
duration.get( "seconds" ) + " sec";
} else {
clearInterval( ObjInterval );
// à zéro, on réinitialise le compteur universel
countdown( "#countdown", 1, 0, 0 ,0 , 7 );
note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
}
}, interval * 1000 );
};
document.addEventListener( 'DOMContentLoaded', ev => {
}, false );
window.addEventListener( 'load', ev => {
// id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
// ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
countdown( "#countdown", 1, 0, 0 ,0 , 7 );
}, false );
});
var index=$('a[href="/search?search_id=activetopics"]').length;
var portail=$('table[class="portal"]').length;
if((index)||(portail))
{
$('head').before('<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>');
$('body').append('<output id="countdown"></output>');
}
});
Penser a cliquer sur le bouton
Puis la css :
- Code:
/*LE CONTENEUR*/
#countdown
{
background:#2e2e2e;
text-align:center;
height:50px;
padding: 10px;
width: 40%;
position: fixed;
left: 0;
top: 50px;
line-height:50px;
color:#3bd9eb;
font-size:14px;
}
- Milouze14Fondateur
-
Mar 3 Déc 2019 - 15:57
Hum,
je ne suis pas adepte des règles de Forumactif concernant les doubles post Serge.
Je préfère en voir et avoir les informations de mon côté
.
Pour le script, tu peux le modifier ainsi afin qu'il soit bien actif sur le portail et l'index , le précédent injecté le script sur toutes les pages:
je ne suis pas adepte des règles de Forumactif concernant les doubles post Serge.
Je préfère en voir et avoir les informations de mon côté
.Pour le script, tu peux le modifier ainsi afin qu'il soit bien actif sur le portail et l'index , le précédent injecté le script sur toutes les pages:
- Code:
$(function(){
var index=$('a[href="/search?search_id=activetopics"]').length;
var portail=$('table[class="portal"]').length;
if((index)||(portail))
{
'use strict';
const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
const
ctx = new AudioContext(),
note = ( frequency = 277.18, duration = 1.0, type = "sine" ) => {
let
osc = ctx.createOscillator(),
gainNode = ctx.createGain();
osc.type = type;
osc.connect( gainNode );
osc.frequency.value = frequency;
gainNode.connect( ctx.destination );
osc.start( 0 );
gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
return Promise.resolve( "note" );
};
let
timer = document.querySelector( id ),
duration = moment.duration({
"seconds" : seconds,
"minutes" : minutes,
"hours" : hours,
"days" :days,
"months" : months,
"years" : years
}),
ObjInterval = setInterval( () => {
duration.subtract( interval, "seconds" );
if ( duration.asMilliseconds() > -1 ){
timer.value = "Temps restant pour voter: " +
http://duration.get( "years" ) + " an(s), " +
http://duration.get( "months" ) + " mois, " +
duration.get( "days" ) + " j, " +
duration.get( "hours" ) + " h, " +
duration.get( "minutes" ) + " mn, " +
duration.get( "seconds" ) + " sec";
} else {
clearInterval( ObjInterval );
// à zéro, on réinitialise le compteur universel
countdown( "#countdown", 1, 0, 0 ,0 , 7 );
note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
}
}, interval * 1000 );
};
document.addEventListener( 'DOMContentLoaded', ev => {
}, false );
window.addEventListener( 'load', ev => {
// id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
// ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
countdown( "#countdown", 1, 0, 0 ,0 , 7 );
}, false );
$('head').before('<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>');
$('body').append('<output id="countdown"></output>');
}
});
,- Milouze14Fondateur
-
Mar 3 Déc 2019 - 16:26
C'est étonnant car sur mon fofo de test, il fonctionne bien:
https://testphpbb3.1fr1.net/
Tu as déposé quel script Serge ?
https://testphpbb3.1fr1.net/
Tu as déposé quel script Serge ?
- Milouze14Fondateur
-
Mar 3 Déc 2019 - 16:31
Essayes ce script modifié Serge,
il se peut qu'il rentrait en conflit avec un autre:
il se peut qu'il rentrait en conflit avec un autre:
- Code:
$(function(){
$('head').before('<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>');
var index=$('a[href="/search?search_id=activetopics"]').length;
var portail=$('table[class="portal"]').length;
if((index)||(portail))
{
$('body').append('<output id="countdown"></output>');
$(function(){
const countdown = ( id = "#countdown", interval = 1, seconds = 0, minutes = 0, hours = 0, days = 7, months = 0, years = 0 ) => {
const
ctx = new AudioContext(),
note = ( frequency = 277.18, duration = 1.0, type = "sine" ) => {
let
osc = ctx.createOscillator(),
gainNode = ctx.createGain();
osc.type = type;
osc.connect( gainNode );
osc.frequency.value = frequency;
gainNode.connect( ctx.destination );
osc.start( 0 );
gainNode.gain.exponentialRampToValueAtTime( 0.00001, ctx.currentTime + duration );
return Promise.resolve( "note" );
};
let
timer = document.querySelector( id ),
duration = moment.duration({
"seconds" : seconds,
"minutes" : minutes,
"hours" : hours,
"days" :days,
"months" : months,
"years" : years
}),
ObjInterval = setInterval( () => {
duration.subtract( interval, "seconds" );
if ( duration.asMilliseconds() > -1 ){
timer.value = "Temps restant pour voter: " +
http://duration.get( "years" ) + " an(s), " +
http://duration.get( "months" ) + " mois, " +
duration.get( "days" ) + " j, " +
duration.get( "hours" ) + " h, " +
duration.get( "minutes" ) + " mn, " +
duration.get( "seconds" ) + " sec";
} else {
clearInterval( ObjInterval );
// à zéro, on réinitialise le compteur universel
countdown( "#countdown", 1, 0, 0 ,0 , 7 );
note( 261.63, 2.0 ).catch( er => { console.error( er ) } );
}
}, interval * 1000 );
};
document.addEventListener( 'DOMContentLoaded', ev => {
}, false );
window.addEventListener( 'load', ev => {
// id, intervalle en secondes, secondes, minutes, heures, jours, mois, ans
// ci-dessous : une minute 7 jours 0 heures 0 minutes et 0 secondes avec un intervalle d'une seconde
countdown( "#countdown", 1, 0, 0 ,0 , 7 );
}, false );
});
}
});
- Milouze14Fondateur
-
Mar 3 Déc 2019 - 17:47
Ok merci Serge,
c'est assez étonnant effectivement.
J'ai trouvé une autre procédure, j'ai créé une page html :
http://whoroot.forumactif.com/h2-les-votes
et on retient juste la fin soit ceci:
Puis le script a placer sur l'index et le portail:
Puis la c.s.s:
Le soucis est qu'il y a une latence avec ce script d'environ 3 secondes avant d'avoir l'affichage.
On peut modifier ainsi on met un display none dans la css et on ajoutes au script cette ligne:
Soit le script complet:
c'est assez étonnant effectivement.
J'ai trouvé une autre procédure, j'ai créé une page html :
http://whoroot.forumactif.com/h2-les-votes
et on retient juste la fin soit ceci:
- Code:
/h2-les-votes
Puis le script a placer sur l'index et le portail:
- Code:
$(function(){
$('body').append('<div id="compte"></div>');
$("#compte").load("/h2-les-votes");
});
Puis la c.s.s:
- Code:
/*LE CONTENEUR*/
#compte
{
background:#2e2e2e;
text-align:center;
height:50px;
padding: 10px;
width: 40%;
position: fixed;
left: 0;
top: 150px;
line-height:50px;
color:#3bd9eb;
font-size:14px;
}
Le soucis est qu'il y a une latence avec ce script d'environ 3 secondes avant d'avoir l'affichage.
On peut modifier ainsi on met un display none dans la css et on ajoutes au script cette ligne:
- Code:
$('#compte').delay(3000).fadeIn();
Soit le script complet:
- Code:
$(function(){
$('body').append('<div id="compte"></div>');
$('#compte').load('/h2-les-votes');
$('#compte').delay(3000).fadeIn();
});
![[BESTOF] [PHPBB3]Compte à rebours hebdomadaire permanent - Page 2 125](https://servimg.com/r/2020118727/125.png)
Page 2 sur 3 • 1, 2, 3
Sujets similaires
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 2 sur 3
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum