BullGuard Antivirus Sale - 60% Off with openElement !
Accueil Forum Accueil Forum >

openElement

> Tutoriaux utilisateurs
  Nouveaux messages Nouveaux messages Fil RSS  - Loupe grossissante sur image OE avec blowup.js
  FAQ FAQ  Rechercher dans le Forum   Inscription Inscription  Connexion Connexion

Loupe grossissante sur image OE avec blowup.js

 Répondre Répondre
Auteur
Message
Hobby001 allez vers le bas
Admin Group
Admin Group
Avatar
Modérateur

Depuis le: 14 Feb 2015
Pays: Canada, Québec
Status: Inactif
Points: 6507
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer Hobby001 Citer  RépondreRéponse Lien Direct à ce Post Sujet: Loupe grossissante sur image OE avec blowup.js
    Envoyé : 10 Jan 2017 à 15:21
Créer un effet de loupe grossissante sur une image OE à l'aide de blowup.js

Étape 1 blowup.js

Téléchargez https://github.com/paulkr/blowup.js
Dans le fichier blowup.js-gh-pages.zip vous trouverez blowup.js-gh-pages\lib\blowup.js, il vous faudra l'extraire du fichier zip.

Ouvrez openElement

Menu du haut
Onglet=> Projet
Groupe=> Gestion
Bouton=> Ressources
Dans le panneau qui vient de s'ouvrir
Onglet=> Autres
Bouton=> Ajouter des fichiers autres
Sélectionnez blowup.js
Fermez le panneau

Étape 2 l'image

Note: L'image d'origine doit être plus grande (en pixels) que l'élément-image que vous emploierez pour l'insérer dans la page.  Le zoom de la lentille est basé sur cette différence.

Dans votre page openElement, insérez un élément-image et renseignez les parametres de l'image telle que désirée.

Menu Propriétés
Onglet=> Propriétés
Groupe=> Comportement
Assurez-vous que le champ "Optimisation auto" n'est pas coché
Groupe=> Expert
Classe Perso=> Inscrivez: zoom

Étape 3 le code

Ajoutez un bloc de code HTML en position header et inscrivez ceci:

<script type="text/javascript" src="/Files/Other/blowup.js"></script>

Ajoutez un bloc de code javascript en position endbody et inscrivez ceci:

$(function(){
  $('.zoom img').blowup();
});
Voilà c'est réglé, il ne reste qu'à publier.

Merci à Dmit dont je n'ai fait que transcrire les directives





Edité par Hobby001 - 19 Juil 2021 à 12:12
Haut de la page
 Répondre Répondre
  Partagez ce sujet   

Aller au Forum Permissions du forum allez vers le bas

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

Cette page a été affichée en 0.063 secondes.