j-NoScrollbar

jComponent 20 · jcomponent@20 component Exemple chargé avec jComponent 20

ce composant ressemble à j-ViewBox sans barre de défilement native/personnalisée

Configuration :

parent {String} en option, un conteneur à hauteur fixe, peut être window. Valeur par défaut : élément parent.
minheight {Number} une hauteur minimale en pixels (par défaut : 0 - désactivé)
delay {Number} msec. redimensionne à nouveau la case si la valeur est modifiée en fonction du chemin (par défaut : 100)
scrollto {String} défile automatiquement vers le haut/le bas si le path est modifié (par défaut : EMPTY, peut être top ou bottom)
margin {Number} facultatif, une marge supérieure/inférieure ensemble (prend en charge auto qui est compté à partir de offset.top, par défaut : 0)
marginxs {Number} en option, une marge supérieure/inférieure ensemble pour la largeur d'écran xs
marginsm en option, une marge supérieure/inférieure ensemble pour la largeur d'écran sm
marginmd en option, une marge supérieure/inférieure ensemble pour la largeur d'écran md
marginlg en option, une marge supérieure/inférieure ensemble pour la largeur d'écran lg
invisible {Booléen} si true alors viewbox définit la classe invisible lors du rendu (par défaut : true)
initdelay {Number} supprime la classe inivisible après le temps spécifié (par défaut : 250 ms)

Méthodes :

component.scrolltop(val) défile Y
component.scrollbottom(val) fait défiler Y depuis le côté inférieur
component.resize() redimensionne le conteneur (il réagit automatiquement aux événements resize)

Utilisez-le avec <ui-component name="noscrollbar">. Lorsque le composant n'est pas encore chargé, jComponent le télécharge lors de la première utilisation depuis l'adresse dans DEF.fallback (le CDN Componentator par défaut). Auteur : Peter Širka. Source : le référentiel de composants Componentator, licence MIT.

example.html

<div style="width:300px;height:300px;background-color:#F5F5F5">
	<ui-component name="noscrollbar" config="parent:parent" class="invisible">
		BEGIN
		<div style="height:1000px;background-color:red"></div>
		END
	</ui-component>
</div>