Forum Communauté Jeedom

Bonjour,

Peux tu afficher les codes html ? Sinon on peut pas vérifier.

Perso je n’ai eu aucun problème en passant en v4

Bonsoir @scotty92fr,

Merci de la réponse

Pour les codes html il s’agit des codes de winhex ( premier message de la discussion ) que j’ai copier coller.
J’ai juste modifier les id de page design !
Mais sinon il s’agit du code menu design / design code arlequin et enfin début. Je les met en lien au cas où...
Je voulais savoir si il s’agit d’un cas isolé ou si il n’était plus valable pour la V4.
Apparement c’est un cas isolé donc j’ai peur de devoir faire une réinstallation complet
Mais si quelqu’un trouve une solution je suis preneur !

Envoyé de mon iPhone en utilisant Tapatalk

Html Menu :

<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
::-webkit-scrollbar {
display: none;
}

div.scrollmenu {
height: 48px;
background-color: #232A31;
white-space: nowrap;
overflow: auto;

}
div.scrollmenu a {
color: white;
text-align: center;
padding: 18px;
border-bottom: none;
text-decoration: none;
opacity: 1;
padding-top: 15px;
}
div.scrollmenu a:hover {
border-bottom: none;
text-decoration: none;
opacity: 1;
}
la {
display: inline-block;
list-style: none;
opacity: 0.33;
font-size: 13.5px;
color: #FFFFFF;
}
la>a {
display: block;
margin-right: 0px;
color: #FFFFFF;
}
la.active,
la.active:hover {
height: calc(100% - 1px);
border-bottom: 2px solid #F87620;
opacity: 1;
}
la:hover {
border-bottom: 2px solid #F5F5F5;
height: calc(100% - 1px);
cursor: pointer;
}
iframe {
width: 1px;
min-width: 100%;
overflow:hidden!important;
}
</style>
</head>

<div>

<div class="scrollmenu navbar-fixed-top">

<la><a onClick="planHeader_id=4; displayPlan();"><span class="fa maison-home63 fa-lg"></span></a></la>

<la class="active"><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section1'">Résumé</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section2'"><span class="fa jeedom-mouvement fa-lg"></span></a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section3'">Extérieures</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section4'">Luminaires</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section5'">Vmc</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section6'">Chauffages</a></la>

<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section7'">7</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section8'">8</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section9'">9</a></la>
<la><a onclick="document.getElementById('iframe_a').src ='/index.php?v=d&p=plan&plan_id=3&fullscreen=1#section10'">10</a></la>

<la><a onclick="document.getElementById('iframe_a').src ='index.php'">Forum</a></la>

</div>
<div id="menu-div" style="height: 660px; min-width: 100%; background-color: transparant;">
<div style="height: 100%; width: 0px; min-width: 100%; background-color: transparant;">
<iframe id="iframe_a" height="100%" width="105%" frameBorder="0" scrolling="yes" src="index.php?v=d&p=plan&plan_id=3&fullscreen=1">
</iframe>
<script type="text/javascript">
if (/iPad|iPhone|iPod/.test(window.navigator.userAgent)) { document.getElementById('iframe_a').setAttribute('scrolling', 'yes') }
if (/iPad|iPhone|iPod/.test(window.navigator.userAgent)) { document.getElementById('menu-div').style.height = "100%" }
$('.scrollmenu la').on('click', function() {
$(this).addClass('active').siblings().removeClass('active');

});
</script>
</div>
</div>
</div>

Envoyé de mon iPhone en utilisant Tapatalk

Html corps Arlequin :

<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<style>
/* 1E88E5 */
#section1 {padding-top:50px;height:616px;color: #fff; background-color: #1E88E5;} /* bleue */
#section2 {padding-top:40px;height:616px;color: #fff; background-color: black;}
#section3 {padding-top:40px;height:616px;color: #fff; background-color: #673ab7;} /* violet */
#section4 {padding-top:40px;height:616px;color: #fff; background-color: #ff9800;} /* orange */
#section5 {padding-top:40px;height:616px;color: #fff; background-color: #00bcd4;} /* turquoise */
#section6 {padding-top:40px;height:616px;color: #fff; background-color: #009688;} /* bleue canard */
#section7 {padding-top:40px;height:616px;color: #fff; background-color: #FAFAFA;} /* gris */
#section8 {padding-top:40px;height:616px;color: #fff; background-color: #795548;} /* brun bleue indigo 3F51B5 */
#section9 {padding-top:40px;height:616px;color: #fff; background-color: #CDDC39;} /* citron */
#section10 {padding-top:40px;height:616px;color: #fff; background-color: #FFC107;} /* ambre */
</style>
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="50">

<div id="section1" class="container-fluid">
<h3>Résumé</h3>
</div>
<div id="section2" class="container-fluid">
<h3>Présence</h3>
</div>
<div id="section3" class="container-fluid">
<h3>Extérieures</h3>
</div>
<div id="section4" class="container-fluid">
<h3>Luminaires</h3>
</div>
<div id="section5" class="container-fluid">
<h3>VMC</h3>
</div>
<div id="section6" class="container-fluid">
<h3>Chauffages</h3>
</div>
<div id="section7" class="container-fluid">
<h3 style="color:black;">section7</h3>
</div>
<div id="section8" class="container-fluid">
<h3>section8</h3>
</div>
<div id="section9" class="container-fluid">
<h3 style="color:black;">section9</h3>
</div>
<div id="section10" class="container-fluid">
<h3 style="color:black;">section10</h3>
</div>
</body>

Envoyé de mon iPhone en utilisant Tapatalk

@scotty92fr, voici le dernier code html « début »:

<div id="debut">
css/js
<style>

/* Commentaire sur une ligne
//
*/
::-webkit-scrollbar {
width: 0px!important;
display:none!important;
overflow:hidden!important;
}

</style>
<script>
$(document).ready(function () { var anchor_id = window.location.hash; if (anchor_id != "") {

var new_position = $(anchor_id).offset();
window.scrollTo(new_position.left,new_position.top);

} });
</script>
</div>

Envoyé de mon iPhone en utilisant Tapatalk

Forum Communauté Jeedom

[tuto] Design - menu slide - corps scroll

Re: [tuto] Design - menu slide - corps scroll

Re: [tuto] Design - menu slide - corps scroll

Re: [tuto] Design - menu slide - corps scroll

Re: [tuto] Design - menu slide - corps scroll

Re: [tuto] Design - menu slide - corps scroll