Avant toute chose merci de (re)prendre connaissance de la charte et de la respecter.
Pour résumer :
- Avant de poser une question, je cherche si la réponse existe
- Je suis poli, courtois et je respecte tout un chacun sur le forum
- Si un post m'agace : je m'en éloigne plutôt que de répondre d'une façon qui pourrait être mal interprétée


Il n'est jamais du luxe que de rappeler des choses simples :
Courtoisie, amabilité, politesse et bonne humeur sont les maîtres mots pour un forum sympathique, bienveillant et accueillant :)

Toute la communauté vous remercie

Tablettes dédiées domotique

Cette partie est réservée à l'utilisation de l'interface web pour smartphone et tablettes
IPaaadPro
Timide
Messages : 71
Inscription : 04 févr. 2017, 23:18

Re: Tablettes dédiées domotique

Message par IPaaadPro » 17 oct. 2018, 09:58

Avec plaisir Pascal.
Dès que ça touche le html, je déconnecte lol.

Par exple, je rentre le code que tu as mis pour afficher l'heure en bas à droite et chez moi, ça ne fonctionne pas. Je ne sais même pas comment débug, je suis paumé :'(


J'ai réussi à faire les 12 pages à base de copier / coller mais comment on fait pour éditer le code une fois sauvegardé? j'ai les boutons pour changer de vue mais je n'arrive pas retourner dans les propriétés de l'élément HTML... comment faire svp?

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 18 oct. 2018, 19:42

Bonjour IPaaadPro,

Pour l'heure, il faut que tu me donnes un peu plus de détail, je n'ai pas compris ce qui t'arrive. Tu ne vois rien du tout? quel est la taille de ton design en pixel?

Pour les 12 pages, en mode edition, il faut faire un click droit sur les icones et choisir "Paramètre d'affichage"
Capture.JPG
Capture.JPG (21.92 Kio) Consulté 417 fois
Et voici le code pour aller directement sur une page en donnant la page dans l'url, exemple:
http://192.168.1.50/index.php?v=d&p=pla ... d=2&page=4


Le code (j'ai tout remis)

Code : Tout sélectionner

<meta  id="jeedomViewport" name="viewport" content="user-scalable=0;" /> 
<script>  
    if (screen.width >= 1280) {
      	// la tablette
        var mvp = document.getElementById('jeedomViewport');
        mvp.setAttribute('content','width=1280; height=800; initial-scale=1.0; user-scalable=0;');
    } 
   else {    	
    var scaleX = screen.width / 1280;
    var scaleY = screen.height / 800;
    var scale = scaleX < scaleY ? scaleX : scaleY; 
    var mvp = document.getElementById('jeedomViewport'); 
    mvp.setAttribute('content','initial-scale='+scale+';');
  /*   document.body.style.transform: scale(scale);
     document.body.style['-o-transform'] = scale;
     document.body.style['-webkit-transform'] = scale;
     document.body.style['-moz-transform'] = scale;*/
  }  
    
</script>
<!-- pour la tablette permet de ne pas avoir de scroll 
<meta name="viewport" content=" width=device-width; initial-scale=1.0; user-scalable=0;" />  -->
<style>

/*
  le plan total fait 15360x800
  pour un ecran de 1280x800
*/  
.div_backgroundPlan {
  background: url("plugins/widget/core/images/Background 1280x800.jpg") repeat-x;
}
div.menu_top{
	height:70px;
	background-color:rgba(0,0,0,0.6);
	border-bottom:2px solid rgba(0,0,0,1);
}

ul.monmenu ul.monmenu_sep{
	list-style-type:none;
	color:rgba(255,255,255,0.8);
	font-family:Roboto;
	font-size: 16px;
	font-weight: normal;
}

li.monmenu{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-left: 1px solid rgba(255,255,255,0.3);
	border-right: 1px solid rgba(255,255,255,0.3);
	background-color: rgba(0,0,0,0.2);
}

div.imagette{
	text-align: center;
	margin-bottom: 5px;
	opacity: 0.8;
}

li.monmenu:hover{
	background-color: rgba(255,255,255,0.2);
}

li.selected{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-left: 1px solid rgba(255,255,255,0.3);
	border-right: 1px solid rgba(255,255,255,0.3);
	background-color: rgba(255,255,255,0.2);
}

li.monmenu_sep{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-right: 1px solid rgba(0,0,0,0.3);
}

div.bouton{
	opacity: 1;
}

div.bouton:hover{
	opacity: 0.5;
}  
</style>


<div id="allTopMenus">
  <!-- ici on va copier le div id=menuPage plusieur fois -->
<div id="menuPage" class="menu_top">
<ul class="monmenu">

	<a onClick="scrollToPage(1);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_maison_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(2);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_volets_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(3);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_camera_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(4);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_chauffage_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(5);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_lumiere_50x50.png" height=50px width=50px></div></br></li></a>

    <a onClick="scrollToPage(6);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_tv_50x50.png" height=50px width=50px></div></br></li></a>

    <a onClick="scrollToPage(7);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_piscine_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(8);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_jardin_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(9);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_meteo_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(10);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_energie_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(11);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_ecole_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(12);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_settings_50x50.png" height=50px width=50px></div></br></li></a>
</ul>
</div>
</div>



<script>
var nbOfPage=12;
var pageSizeX=1280;
var pageSizeY=800;
 
$('#allTopMenus').parent("div").css({ 
      "position":"absolute",
      "left":"0px",
      "top":"0px",
	  "width":(nbOfPage*pageSizeX)+"px"
    });

$(".div_backgroundPlan").eq(0).css({ "width": nbOfPage*pageSizeX, "height": pageSizeY });
  
var cptPage;
for (cptPage = 0; cptPage < nbOfPage; cptPage++) {
  var newid = "menuPage";
  if (cptPage!=0){
    var menuPage = document.getElementById('menuPage');
    var clone = menuPage.cloneNode(true); // true means clone all childNodes and all event handlers
    newid = "menuPage"+cptPage; 
    clone.id = newid;
    var allTopMenus=document.getElementById('allTopMenus');
    allTopMenus.appendChild(clone);
    $("#"+newid+" li").eq(cptPage).addClass("selected");
  }
  $("#"+newid).eq(0).css({ 
 		"position":"absolute",
      	"left":(cptPage*pageSizeX)+"px",
      	"top":"0px",
	  	"width":pageSizeX+"px"                                        
   });
}
// la pager 0 je l'a fait en dernier sinon sa selection est cloné sur toute les autres
$("#menuPage li").eq(0).addClass("selected");

var currentPage=0;
function scrollToPage(page){
  currentPage=page;
  window.scrollTo((page-1)*pageSizeX,0);     
}
  
// pour cacher la scroll bar
$("body").css("overflow", "hidden");
/*$(document).ready(function() {

  	$(document).bind("touchmove",function(event){       
        event.preventDefault();
      	scrollToPage(currentPage);
    });

});*/

 
function GetURLParameter(sParam) {
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');
    for (var i = 0; i < sURLVariables.length; i++)  {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam) {
            return sParameterName[1];
        }
    }
  return null;
}
  
var page = GetURLParameter('page'); 
if (page != null){
  scrollToPage(page);
}
</script>

IPaaadPro
Timide
Messages : 71
Inscription : 04 févr. 2017, 23:18

Re: Tablettes dédiées domotique

Message par IPaaadPro » 24 oct. 2018, 17:50

Merci Pascal.
En fait, j'ai posé un élément html et j'ai mis un code pour afficher un itinéraire google maps. ça fonctionne très bien sauf que je ne peux plus éditer le-dit code... impossible de faire click droit car sinon ça fait click droit sur la carte google... je suis coincé :D

edit : J'ai réussi à trouver une zone right-clickable !

Merci pour l'appel des pages, ça fonctionne nickel !

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 24 oct. 2018, 18:16

J'ai deja eu ce probleme de right-click surtout quand on insere des widgets externe, et là c'est compliqué :(
c'est pour ca qu'il faut des sauvegardes :)

Super, pour le changement de page, tu as vu, tout est très réactif du coup, je ne passe plus que par ça moi

IPaaadPro
Timide
Messages : 71
Inscription : 04 févr. 2017, 23:18

Re: Tablettes dédiées domotique

Message par IPaaadPro » 24 oct. 2018, 18:31

à part quand tu appelles une page. ça recharge toutes les pages en fait.
Tu ne peux pas juste scroller sur la bonne page de manière automatique si tu vois ce que je veux dire

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 24 oct. 2018, 20:39

Salut @IPaaadPro,

Y a qu'a demander ;)

Tu crée d'abord un Widget que tu appelles: DesignSetPage
sur la version: Dashboard
de type: Info
et de sous type: Numérique

avec le code suivant:

Code : Tout sélectionner

<div class="cmd tooltips cmd-widget" data-type="info" data-subtype="numeric" data-cmd_id="#id#" >
  	<center>
    	<span style="font-size: 1.5em;">Page: #state#</span> 
 	</center>        

  <script>
    	 scrollToPage(#state#);
	</script>
</div>
Il faut ensuite que tu crées un virtuel que j'ai appelé "Design Page Home" comme ci dessous:
Virtuel.JPG
Virtuel.JPG (46.74 Kio) Consulté 307 fois
Puis tu rajoutes le virtuel dans le design.
Et c'est fini.

Ensuite pour changer de page tu appelles l'url:
http://xxx.xxx.xxx.xxx/core/api/jeeApi. ... 3&slider=3

où 1353 est l'id de la commande: setPage
et le 3 est le numero de la page

Voila, Bon test,
Pascal

Tarl
Timide
Messages : 43
Inscription : 17 avr. 2017, 09:01

Re: Tablettes dédiées domotique

Message par Tarl » 26 oct. 2018, 09:51

Bonjour à tous,

Le projet Diskio Pi revient bientôt sur Kickstarter dans une nouvelle mouture plus économique si j'ai bien compris. A suivre ;)

https://www.diskiopi.com/

Dapolux
Timide
Messages : 161
Inscription : 12 déc. 2016, 13:48
Localisation : Lille

Re: Tablettes dédiées domotique

Message par Dapolux » 26 oct. 2018, 23:36

Merci Pascal pour ton partage, c'est top!
Je viens de le mettre en place sur ma version mobile (Iphone) et ça marche bien, c'est très réactif du coup.
J'ai juste un souci de scroll, car j'arrive tout de même à scroller sur les côtés malgré la balise meta du début, une idée?
Jeedom DIY@RPI3
Aeon Stick Zwave : 15 FGR222, 2 FGS222, 6 FGD212, Oeil de Fibaro, 1 Wallplug
RFXCOM : 3 Prises, Téléco, 4 Sondes temp. / Moteur Somfy
Multimédia: Nas Synology / 2 KODI@RPI / Max2Play@RPI3
Xiaomi: 3 RGB Yeelight

diabolyk
Timide
Messages : 231
Inscription : 01 févr. 2018, 12:41

Re: Tablettes dédiées domotique

Message par diabolyk » 27 oct. 2018, 11:00

pascal a écrit :
05 oct. 2018, 21:12
Bonjour,
J'avais le meme problème que vous, j'avais fait un design puis selon des click depuis un menu, je chargeais un autre design, mais c'etait long. 3 secondes, c'est court mais c'est long quand on attend. je voulais de la réactivité instantané. Du coup après avoir lu l'idée de @fwehrle j'ai fait ce qu'il préconisait, soit un seul design très panoramique dédié a ma tablette.
Mais je voulais pouvoir ne faire qu'une seule fois mon menu, et qu'il soit répété sur toutes les pages.
Quelques javascript plus tard, j'ai réussis a le multiplier sur toutes mes pages, et là c'est instantané, même pas une millisecondes entre 2 changement de vue. Je suis trop content :)

je vous partage mon javascript et je vous montre mon menu et mon design, si ça peut servir a d'autres.
D'abord voici le résultat, je n'ai pas encore fini toutes mes vue, mais ça avance bien:

1ere vue:
DesignVue1.JPG
2eme vue:
DesignVue2.JPG

Pour avoir le menu sur toutes mes pages, ma tablette a une resolution de 1280x800
j'ai 12 vue a créer, donc j'ai creer un design de 1280*12 =15360 sur 800
ensuite j'ai creer une element texte/html et voici le code, il vous reste a modifier les chemins des images.
J'ai aussi désactiver la scrollbar ainsi que le scroll, en gros on ne peut presque pas se déplacer a part en passant par les bouttons.

Code : Tout sélectionner

<!-- pour la tablette permet de ne pas avoir de scroll -->
<meta name="viewport" content=" width=device-width; initial-scale=1.0; user-scalable=0;" /> 


<style>
/*
  le plan total fait 15360x800
  pour un ecran de 1280x800
*/  
.div_backgroundPlan {
  background: url("plugins/widget/core/images/Background 1280x800.jpg") repeat-x;
}
div.menu_top{
	height:70px;
	background-color:rgba(0,0,0,0.6);
	border-bottom:2px solid rgba(0,0,0,1);
}

ul.monmenu ul.monmenu_sep{
	list-style-type:none;
	color:rgba(255,255,255,0.8);
	font-family:Roboto;
	font-size: 16px;
	font-weight: normal;
}

li.monmenu{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-left: 1px solid rgba(255,255,255,0.3);
	border-right: 1px solid rgba(255,255,255,0.3);
	background-color: rgba(0,0,0,0.2);
}

div.imagette{
	text-align: center;
	margin-bottom: 5px;
	opacity: 0.8;
}

li.monmenu:hover{
	background-color: rgba(255,255,255,0.2);
}

li.selected{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-left: 1px solid rgba(255,255,255,0.3);
	border-right: 1px solid rgba(255,255,255,0.3);
	background-color: rgba(255,255,255,0.2);
}

li.monmenu_sep{
	display:inline-block;
	width: 100px;
	margin-left: -5px;
	text-align: center;
	height: 70px;
	padding-top: 10px;
	border-right: 1px solid rgba(0,0,0,0.3);
}

div.bouton{
	opacity: 1;
}

div.bouton:hover{
	opacity: 0.5;
}  
</style>


<div id="allTopMenus">
  <!-- ici on va copier le div id=menuPage plusieur fois -->
<div id="menuPage" class="menu_top">
<ul class="monmenu">

	<a onClick="scrollToPage(1);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_maison_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(2);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_volets_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(3);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_camera_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(4);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_chauffage_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(5);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_lumiere_50x50.png" height=50px width=50px></div></br></li></a>

    <a onClick="scrollToPage(6);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_tv_50x50.png" height=50px width=50px></div></br></li></a>

    <a onClick="scrollToPage(7);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_piscine_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(8);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_jardin_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(9);"><li class="monmenu" ><div class="imagette"><img src="montheme/images/menu_meteo_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(10);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_energie_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(11);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_ecole_50x50.png" height=50px width=50px></div></br></li></a>

	<a onClick="scrollToPage(12);"><li class="monmenu"><div class="imagette"><img src="montheme/images/menu_settings_50x50.png" height=50px width=50px></div></br></li></a>
</ul>
</div>
</div>



<script>
var nbOfPage=12;
var pageSizeX=1280;
var pageSizeY=800;

//screen.orientation.lock('landscape');  // force le mode paysage sur mobile

$('#allTopMenus').parent("div").css({ 
      "position":"absolute",
      "left":"0px",
      "top":"0px",
	  "width":(nbOfPage*pageSizeX)+"px"
    });

$(".div_backgroundPlan").eq(0).css({ "width": nbOfPage*pageSizeX, "height": pageSizeY });
  
var cptPage;
for (cptPage = 0; cptPage < nbOfPage; cptPage++) {
  var newid = "menuPage";
  if (cptPage!=0){
    var menuPage = document.getElementById('menuPage');
    var clone = menuPage.cloneNode(true); // true means clone all childNodes and all event handlers
    newid = "menuPage"+cptPage; 
    clone.id = newid;
    var allTopMenus=document.getElementById('allTopMenus');
    allTopMenus.appendChild(clone);
    $("#"+newid+" li").eq(cptPage).addClass("selected");
  }
  $("#"+newid).eq(0).css({ 
 		"position":"absolute",
      	"left":(cptPage*pageSizeX)+"px",
      	"top":"0px",
	  	"width":pageSizeX+"px"                                        
   });
}
// la page 0 je le fait en dernier sinon sa selection est cloné sur toutes les autres
$("#menuPage li").eq(0).addClass("selected");

var currentPage=0;
function scrollToPage(page){
  currentPage=page;
  window.scrollTo((page-1)*pageSizeX,0);     
}
  
// pour cacher la scroll bar
$("body").css("overflow", "hidden");
 

</script>
Salut,

je suis en train de faire mon design comme le tiens, par contre ton script tu le mets ou exactement ?

merci

Dapolux
Timide
Messages : 161
Inscription : 12 déc. 2016, 13:48
Localisation : Lille

Re: Tablettes dédiées domotique

Message par Dapolux » 27 oct. 2018, 11:16

Bonjour Diabolyk,

Tu peux tout mettre directement dans ton bloc html (clic droit sur le design, ajouter texte/html, puis tu peux directement mettre la partie css, la partie html et la partie script dedans).

Il est aussi possible de tout séparer en passant par la personnalisation avancée si tu le souhaites)
Jeedom DIY@RPI3
Aeon Stick Zwave : 15 FGR222, 2 FGS222, 6 FGD212, Oeil de Fibaro, 1 Wallplug
RFXCOM : 3 Prises, Téléco, 4 Sondes temp. / Moteur Somfy
Multimédia: Nas Synology / 2 KODI@RPI / Max2Play@RPI3
Xiaomi: 3 RGB Yeelight

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 27 oct. 2018, 11:50

Dapolux,

Pour le Scroll droite gauche, j'ai le même problème.
Si j'ai un peu de temps je regarderais


Envoyé de mon Redmi Note 5 en utilisant Tapatalk


Dapolux
Timide
Messages : 161
Inscription : 12 déc. 2016, 13:48
Localisation : Lille

Re: Tablettes dédiées domotique

Message par Dapolux » 27 oct. 2018, 12:27

Après un peu de recherches, j'ai une solution qui semble fonctionner:

J'ai passé le body en fixed:
body {
position:fixed;
}

Puis j'ai adapté la fonction scrollToPage:

function scrollToPage(page){
currentPage=page;
$("body").css("left", (page-1)*pageSizeX*(-1) + "px");
}
Jeedom DIY@RPI3
Aeon Stick Zwave : 15 FGR222, 2 FGS222, 6 FGD212, Oeil de Fibaro, 1 Wallplug
RFXCOM : 3 Prises, Téléco, 4 Sondes temp. / Moteur Somfy
Multimédia: Nas Synology / 2 KODI@RPI / Max2Play@RPI3
Xiaomi: 3 RGB Yeelight

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 27 oct. 2018, 13:07

Super Dapolux,
Ça marche très bien, ça commence a devenir vraiment top maintenant :)

diabolyk
Timide
Messages : 231
Inscription : 01 févr. 2018, 12:41

Re: Tablettes dédiées domotique

Message par diabolyk » 27 oct. 2018, 13:20

Dapolux a écrit :
27 oct. 2018, 12:27
Après un peu de recherches, j'ai une solution qui semble fonctionner:

J'ai passé le body en fixed:
body {
position:fixed;
}

Puis j'ai adapté la fonction scrollToPage:

function scrollToPage(page){
currentPage=page;
$("body").css("left", (page-1)*pageSizeX*(-1) + "px");
}
tu applique cette modif toujours dans le texte html de la page ?

Dapolux
Timide
Messages : 161
Inscription : 12 déc. 2016, 13:48
Localisation : Lille

Re: Tablettes dédiées domotique

Message par Dapolux » 27 oct. 2018, 13:32

Oui, toujours dedans.
La partie body, à l'interieur de la balise de Style, et pour la fonction, la ou elle est déjà définie, dans la balise Script.
Jeedom DIY@RPI3
Aeon Stick Zwave : 15 FGR222, 2 FGS222, 6 FGD212, Oeil de Fibaro, 1 Wallplug
RFXCOM : 3 Prises, Téléco, 4 Sondes temp. / Moteur Somfy
Multimédia: Nas Synology / 2 KODI@RPI / Max2Play@RPI3
Xiaomi: 3 RGB Yeelight

diabolyk
Timide
Messages : 231
Inscription : 01 févr. 2018, 12:41

Re: Tablettes dédiées domotique

Message par diabolyk » 27 oct. 2018, 14:00

ok donc tu rajoute avant </style> :
body {
position:fixed;
}

et tu remplace :
function scrollToPage(page){
currentPage=page;
window.scrollTo((page-1)*pageSizeX,0);

par :
function scrollToPage(page){
currentPage=page;
$("body").css("left", (page-1)*pageSizeX*(-1) + "px");

c'est bien ça ?

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 27 oct. 2018, 14:04

Oui c'est ça

Envoyé de mon Redmi Note 5 en utilisant Tapatalk


diabolyk
Timide
Messages : 231
Inscription : 01 févr. 2018, 12:41

Re: Tablettes dédiées domotique

Message par diabolyk » 27 oct. 2018, 14:14

merci à toi

je commence mon design avec ta méthode, on verra ce que ça donne ;)

du coup j'ai ajouté un design à la suite des autres où il y a celui là plutôt que "X" designs histoire de voir ce que ça donne sans tout crasher...

Avatar de l’utilisateur
pascal
Actif
Messages : 689
Inscription : 19 août 2014, 20:57
Contact :

Re: Tablettes dédiées domotique

Message par pascal » 27 oct. 2018, 14:18

oui c'est mieux de faire comme ca, moi maintenant je n'ai plus que 2 designs, un pour ma tablette, et un pour mon tel.
chacun avec plusieurs pages

diabolyk
Timide
Messages : 231
Inscription : 01 févr. 2018, 12:41

Re: Tablettes dédiées domotique

Message par diabolyk » 27 oct. 2018, 14:32

oui je viens de faire un essai c'est vraiment topissime !!!!!

quand j'aurais fini celui de la tablette je ferais celui du téléphone et voilà ;)

merci encore t'es un as

Répondre

Revenir vers « Portail web smartphone & tablettes »

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités