28172 sujets

CSS et mise en forme, CSS3

Bonjour à toutes et à tous.
J'aurais aimé savoir ce que veut dire ce bout de code css,
je devrais plutôt dire : quelle incidence a-t-il sur mon futur site ?
Pour information, je n'ai rien inventer, il vient d'un PlugIn de thepetedesign, voir à cette adresse http://www.thepetedesign.com/demos/purejs_onepage_scroll_demo.html et il est en relation avec le Javascript qui je crois, crée la class dans le DOM et le manipule avec ce CSS.
Merci de votre retour.

Très cordialement,
Régis.

PS : J'espère que ce bout de code sera bien mis en forme avec colorisation syntaxique,
C'est la première fois que je le fait.

body.disabled-onepage-scroll .onepage-wrapper  section {
	min-height: 100%;
	height: auto;
}
body.disabled-onepage-scroll .main section .page_container, body.disabled-onepage-scroll .main section.page3 .page_container{
	padding: 20px;
	margin-top: 150px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
body.disabled-onepage-scroll  section .page_container h1{
	text-align: center;
	font-size: 50px;
}
body.disabled-onepage-scroll section .page_container h2, body.disabled-onepage-scroll section .page_container .credit, body.disabled-onepage-scroll section .page_container .btns{
	text-align: center;
	width: 100%;
}
body.disabled-onepage-scroll .main section.page1 > img {
	position: absolute;
	width: 80%;
	left: 10%;
}
body.disabled-onepage-scroll .main section > img {
	position: relative;
	max-width: 80%;
	bottom: 0;
}
body.disabled-onepage-scroll code {
	width: 95%;
	margin: 0 auto 25px;
	float: none;
	overflow: hidden;
}
body.disabled-onepage-scroll .main section.page3 .page_container {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	right: 0;
}
Modérateur
Salut,

De ce que j'en comprend c'est une classe qui se mettra sur le body si tu décide de désactiver le principe du one page scroll.

Le bout de CSS viens juste "remettre à zero" les changement qui ont été fait pour que le site retrouve un fonctionnement naturel.
Essaie de la rajouter manuellement sur le body de la demo tu verras.

Par exemple :
body.disabled-onepage-scroll .onepage-wrapper  section {
	min-height: 100%;
	height: auto;
}

redonne a chaque section une hauteur automatique et ne sera pas limité a 100% de la hauteur du viewport mais pourra dépasser...

Après si on regarde les fichier du plugin et qu'on recherche cette classe on ne trouve rien de très concluant : https://github.com/peachananr/purejs-onepage-scroll/search?utf8=%E2%9C%93&q=disabled-onepage-scroll&type=
Je ne vois aucun code qui la rajoute automatiquement. Juste des verif. Il faudrait regarder sur la FAQ ou le Forum s'il y en a un ou envoyer un message au créateur.
Bonjour Laurent.
Je te remercie pour ta réponse, mais je ne sais pas si je discute avec vous,
ou si je réponds à mon propre message, car je ne sais pas comment faire pour discuter
avec une personne en particulier.
Bref, dans mon projet, je ne vois pas dans la partie de code redéfini, la classe disabled_onepage_scroll.
Il y a 8 jours, j'avais posté dans la catégorie débutant le sujet suivant :
OnePage Scroll
Voici ce que je demandais :
Bonjour à tous et à toutes,
Je suis en train de faire mon site en front end, genre vitrine.
Je suis parti d'un PlugIn de thepetedesign, voir à cette adresse http://www.thepetedesign.com/demos/purejs_onepage_scroll_demo.html
Je suis plutôt satisfait du résultat provisoire, tous n'est encore parfaitement calé,
Mais avant d'aller plus avant, une fonction ne me convient pas lorsque je suis sur smartphone.
Il s'agit du "glissé avec le doigt" entre chaque section.
Avec 3 sections no problème, mais dès que j'en mets une quatrième seul l'ascensseur : "les boutons de droite", ou le menu 'Info' 'Graphie' 'Portfolio' 'Rex' me permettent d'accéder à mes sections/page.
voir provisoirement le résultat sur :
http://cefii-developpements.fr/regis500/test_page2/
Attention c'est beaucoup de code et peut-être si vous arrivez à voir le css ou les js,
ce n'est pas très conventionnel...
Si vous avez une solution pour se glissé de doigt ou "ScrollDigital" (Je répète, 3 sections çà marche, 4 sections pas de Scroll manuel)

J'ai reçu une réponse de Niuxe qui, certes très instructive ne m'a pas permis de résoudre le scrolling manuel
Cette dernière demande sur le CSS est parce que je pense que c'est ce petit bout de code (celui ou vous avez répondu) qui pose problème.
J'ai refait une demande à Niuxe, pas de réponse actuellement.
si de votre côté vous êtes plutôt téméraire pour regarder http://cefii-developpements.fr/regis500/test_page2/ et me donner votre opinion.
Je double ce message en privé, car je ne suis pas sûr que vous puissiez le voir dans les réponses

cordialement,
Régis
rchemineau@icloud.com
rexrex2@free.fr
Modérateur
Alors j'ai jeté un oeil avec mon téléphone. La navigation "ScrollDigital" ne marche pas du tout pour moi. Les menus marchent bien y'a aucun soucis mais j'ai beau faire glisser mon doigt dans n'importe quel sens sur toutes les pages ça ne change pas de page.

Ensuite pour ce qui est du bout de CSS, la classe "disabled-onepage-scroll" n'est pas présente sur le body (du moins via l'inspecteur de code sur PC) donc aucun risque que ce CSS influ sur quelque-chose. Il est présent mais ne s'applique pas.

Tu as testé sur un téléphone ? Ca fonctionne chez toi ?
Bonjour Laurent,
En réponse à ton dernier message (permets-moi de te tutoyer),
Tu me dis que cela ne vient pas du code avec disabled_onepage, ok.
Je vais donc arrêter pour cette piste.
J'ai testé sur mon portable et je teste depuis plusieurs semaines sur celui-ci,
et chaque fois nada pas résultat escompté, cela fonctionne que lorsque je suis en landscape (format paysage) "pour d'autres qui liraient ce message",
ou bien encore, si j'utilise 3 sections "3 pages".
Merci encore pour ton aide.
Bonne journée,
Régis.
Modérateur
a écrit :
Tu me dis que cela ne vient pas du code avec disabled_onepage, ok.

Oui enfin j'en déduit ça vu que la classe n'est pas présente. S'il n'y a pas la classe sur le body alors normalement ça ne devrait pas. C'est toujours dur de l’affirmer a 100% Smiley langue

Ha ouais en Paysage ça fonctionne sur ton site ! Smiley sweatdrop c'est étrange ça... Et le site de démo (avec 3 parties) fonctionne bien en portrait... La je pense qu'il vaut mieux se rapprocher des créateur du plugin.

Tu peux regarder les issues déjà ouvertes sur le projet et éventuellement en ouvrir une nouvelle en exposant ton soucis : https://github.com/peachananr/purejs-onepage-scroll/issues

Ils sauront mieux te répondre que nous je pense.