si vous voulez essayé
vidéo https://youtu.be/riRlEJxTWuU
un slide equipements droite/gauche sur mobile
sur pc faut clic et ensuite les fleches du clavier
je tourne avec un vieux jeedom (message suivant pour une version jeedom recente)
se qui permet de le faire dans un design
d'abord un tableau
1 ligne 6 colonnes
ensuite
un style
display:flex;width:360px;height:180px;overflow:auto;
[tuto] slide dans un design
[tuto] slide dans un design
Dernière édition par winhex le 14 mai 2019, 16:01, édité 8 fois.
Re: swap équipement pour mobile
je ne sais pas la personnalisation avancé (sous configuration) existera toujours alors on va procédé differement
je supprime se qui précède (hormis le tableau)
on va dans le design
on recherche le data-plan_id
chaque elements d'un design posséde un data plan
f12 / icône du bas à gauche / on balade la souris sur l'équipement / le data plan id et à la fin d'une balise precedente dans un html existant ou crée pour l'occasion
dans une balise style "css"
ou on pourrait le mettre dans un script aussi
pour cacher la barre de défilement sous chrome Android en style
::-webkit-scrollbar {
display: none;
}
etant un tableau c'est assez facile d'ajouter une ligne consigne (height:280px) maintenant si on voulait faire un bouton qui slide
overflow invisible et un scroolto en script
je vous laisse cherché vous avez les bases (de toutes manières je vais le faire pour mes VR mais je n'y suis pas encore)
HS
mon design (la base)
chaque menu vert un design différent
tous les équipements s'affiche et un hide pour chacun hormis se que je veux voir en accès
si je clic sur températures
tous les équipement se cache hide
et show pour ceux que je veux voir
afin d'éviter de tous voir un bref moment lors de l'accès
un html blanc qui disparaît une fois la page construite
lien pour la sonde
viewtopic.php?f=29&t=44352
lien avec les menus
viewtopic.php?f=24&t=45317&p=730401#p730401
je supprime se qui précède (hormis le tableau)
on va dans le design
on recherche le data-plan_id
chaque elements d'un design posséde un data plan
f12 / icône du bas à gauche / on balade la souris sur l'équipement / le data plan id et à la fin d'une balise precedente dans un html existant ou crée pour l'occasion
dans une balise style "css"
Code : Tout sélectionner
<style>
[data-plan_id="707"] {
display:flex;width:360px;height:180px;overflow:auto;
}
</style>
Code : Tout sélectionner
var Temperatures = $('[data-plan_id="707"]');
$( document ).ready(function() {
Temperatures.css('display','flex').css('height','180px').css('overflow','auto').css('width','360px');
}
::-webkit-scrollbar {
display: none;
}
etant un tableau c'est assez facile d'ajouter une ligne consigne (height:280px) maintenant si on voulait faire un bouton qui slide
overflow invisible et un scroolto en script
je vous laisse cherché vous avez les bases (de toutes manières je vais le faire pour mes VR mais je n'y suis pas encore)
HS
mon design (la base)
chaque menu vert un design différent
tous les équipements s'affiche et un hide pour chacun hormis se que je veux voir en accès
si je clic sur températures
tous les équipement se cache hide
et show pour ceux que je veux voir
afin d'éviter de tous voir un bref moment lors de l'accès
un html blanc qui disparaît une fois la page construite
lien pour la sonde
viewtopic.php?f=29&t=44352
lien avec les menus
viewtopic.php?f=24&t=45317&p=730401#p730401
Dernière édition par winhex le 25 mai 2019, 13:03, édité 1 fois.
Re: [tuto] slide dans un design
dans un design un html "slide" sur un de nos logs
auto actualisé,..
pour en créé un merci befa
tous ceux qui sont dans le dossier log ainssi que scénario fonctionne de la même manière
pour plusieurs dans le même design faudra changé les class / id pour chaque html (ou créé un imput list pointant sur différent log)
hs
le dossier log comporte un petit fichier .htaccess empêchant son accès d'une autre manière (lien, jquery,..)
Code : Tout sélectionner
<div style="width:90%;height:80%;">
<a class="btn btn-warning pull-right" data-state="1" id="in_eventLogStopStart"><i class="fa fa-pause"></i> {{Pause}}</a>
<input class="form-control pull-right" id="in_eventLogSearch" style="width : 300px;" placeholder="{{Rechercher}}" />
<pre id="pre_globallog" style="display: block;overflow: auto; width:100%;height:100%; font-size:0.9em;line-height: 0.9em;text-align:left !important;" class="pre_eventlog"></pre>
<script>
jeedom.log.autoupdate({
log : 'backup',
display : $('.pre_eventlog'),
search : $('#in_eventLogSearch'),
control : $('#in_eventLogStopStart'),
});
</script>
</div>
pour en créé un merci befa
tous ceux qui sont dans le dossier log ainssi que scénario fonctionne de la même manière
pour plusieurs dans le même design faudra changé les class / id pour chaque html (ou créé un imput list pointant sur différent log)
hs
le dossier log comporte un petit fichier .htaccess empêchant son accès d'une autre manière (lien, jquery,..)
Re: [tuto] slide dans un design
garder un scrollbar général et enlevé pour 1 overflow
dans un fichier texte/html
voir la petite barre en haut à droite (général)
celle sous les sondes n'y est pas
dans un fichier texte/html
Code : Tout sélectionner
<script>
$('[data-plan_id="927"]').css('overflow','auto');
</script>
<style>
[data-plan_id="927"]::-webkit-scrollbar {
display: none;
}
</style>
celle sous les sondes n'y est pas
- Pièces jointes
-
- Screenshot_20190916-195225_Chrome.jpg (493.85 Kio) Consulté 2898 fois
Qui est en ligne ?
Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités