Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Voir le sujet précédent Voir le sujet suivant Aller en bas

  • 0

Résolu Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par Candie le Ven 16 Déc 2016 - 15:04

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://planetegraphisme.creationforum.net/

Description du problème

Bonjour a tous Very Happy
Quelqu'un a-t-il un script, marchant avec Windows 10, afin d'insérer dans un cours posé un objet proposé en début de cours et que le membre pourrait déplacer sur la ligne qu'il est en train de suivre ?
Ce serait un beau cadeau de noël que je ferai à mes membres pour leur faciliter la tâche.
Merci d'avance


Dernière édition par Candie le Mar 3 Jan 2017 - 8:05, édité 1 fois
avatar

Candie
**

Féminin
Messages : 73
Inscrit(e) le : 05/11/2012

http://planetegraphisme.creationforum.net/
Candie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par Candie le Sam 17 Déc 2016 - 11:02

bonjour.
up
avatar

Candie
**

Féminin
Messages : 73
Inscrit(e) le : 05/11/2012

http://planetegraphisme.creationforum.net/
Candie a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par Candie le Mar 20 Déc 2016 - 18:47

up
avatar

Candie
**

Féminin
Messages : 73
Inscrit(e) le : 05/11/2012

http://planetegraphisme.creationforum.net/
Candie a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par oxymore le Mar 20 Déc 2016 - 21:05

Bonsoir

Vous pouvez utiliser Jquery UI
https://jqueryui.com/draggable/

Collez ce code dans description de site
Code:
<script src=https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js></script>

Ensuite dans gestion des codes javascript en cochant sur les sujets collez ce code et enregistrez
Code:
$( document ).ready(function() {

  $(".move").draggable() ;
 
});


Puis en début de vos cours collez ce code (le HTML doit être activé dans les messages )
Code:
<img src="http://www.icone-png.com/png/22/21757.png" class ="move" />
les images ayant la class "move" deviennent "draggable"
avatar

oxymore
***

Messages : 141
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par cedric03 le Mer 21 Déc 2016 - 10:19

bonjour Oxymore

merci pour le script , mais je répugne à activer le html, n'y aurait il pas un autre moyen ?

merci de ta réponse
avatar

cedric03
Nouveau membre

Messages : 14
Inscrit(e) le : 20/12/2016

http://planetegraphisme.creationforum.net
cedric03 a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par oxymore le Mer 21 Déc 2016 - 19:47

Bonsoir

Essayez avec ce code à placer dans gestion des codes javascript en cochant sur les sujets et enregistrez.
Cela va ajouter une image dans le 1er post et normalement vous pouvez la déplacer pour suivre le tuto...
Code:
(function($) {
    $.fn.drags = function(opt) {

        opt = $.extend({handle:"",cursor:"move"}, opt);

        if(opt.handle === "") {
            var $el = this;
        } else {
            var $el = this.find(opt.handle);
        }

        return $el.css('cursor', opt.cursor).on("mousedown", function(e) {
            if(opt.handle === "") {
                var $drag = $(this).addClass('draggable');
            } else {
                var $drag = $(this).addClass('active-handle').parent().addClass('draggable');
            }
            var z_idx = $drag.css('z-index'),
                drg_h = $drag.outerHeight(),
                drg_w = $drag.outerWidth(),
                pos_y = $drag.offset().top + drg_h - e.pageY,
                pos_x = $drag.offset().left + drg_w - e.pageX;
            $drag.css('z-index', 1000).parents().on("mousemove", function(e) {
                $('.draggable').offset({
                    top:e.pageY + pos_y - drg_h,
                    left:e.pageX + pos_x - drg_w
                }).on("mouseup", function() {
                    $(this).removeClass('draggable').css('z-index', z_idx);
                });
            });
            e.preventDefault(); // disable selection
        }).on("mouseup", function() {
            if(opt.handle === "") {
                $(this).removeClass('draggable');
            } else {
                $(this).removeClass('active-handle').parent().removeClass('draggable');
            }
        });

    }
})(jQuery);

$( document ).ready(function() {
$('.post-options:first').before('<div id="myDiv" style="margin-top:8px;"><img src="http://www.icone-png.com/png/22/21757.png" /></div>');
$('#myDiv').drags();
 
});

Vous pouvez bien sur remplacer le lien de l'image dans le code par le lien d'une autre image.
avatar

oxymore
***

Messages : 141
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par lilas le Mer 21 Déc 2016 - 20:13

cheers Merci

santa
avatar

lilas
*****

Féminin
Messages : 805
Inscrit(e) le : 07/08/2004

http://lefofodemacopine.forumactif.com/
lilas a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par cedric03 le Jeu 22 Déc 2016 - 23:30

merci oxymore

Yes Yes victoire Yes Yes ça marche

merci
avatar

cedric03
Nouveau membre

Messages : 14
Inscrit(e) le : 20/12/2016

http://planetegraphisme.creationforum.net
cedric03 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par lilas le Ven 23 Déc 2016 - 5:32

cheers les 2 codes fonctionnent parfaitement avec Internet Explorer mais sous Firefox,
les icônes d'édition au dessus des messages s'évadent hors du cadre du forum... scratch
et le fond personnalisé pour les messages ne s'étend pas comme il le devrait près de la bordure...



Un remède à suggérer ?

Gloups

PS Je n'ai pas testé sur Chrome, je dois changer de PC pour le faire et il est tard au Québec... Demain
avatar

lilas
*****

Féminin
Messages : 805
Inscrit(e) le : 07/08/2004

http://lefofodemacopine.forumactif.com/
lilas a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par Shawn ModdingGaming le Ven 23 Déc 2016 - 8:50

Ou le mieux installez aussi Chrome sur votre ordi: Navigateur Chrome, cela vous ferais gagner du temps !!! Wink

Pour la suite, cela dépendra de vous ...

Cdt.
avatar

Shawn ModdingGaming
***

Masculin
Messages : 183
Inscrit(e) le : 04/11/2016

https://fslogging.forumactif.com
Shawn ModdingGaming a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par cedric03 le Ven 23 Déc 2016 - 13:03

bonjour

même constat ,j'ai des retours des membres qui ont d'autres navigateurs qui ont le texte qui est déplacer a gauche

une solution peut etre ? merci d'avance
avatar

cedric03
Nouveau membre

Messages : 14
Inscrit(e) le : 20/12/2016

http://planetegraphisme.creationforum.net
cedric03 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par Shawn ModdingGaming le Ven 23 Déc 2016 - 14:55

Ligne 4 on vois ce code:

Code:
        opt = $.extend({handle:"",cursor:"move"}, opt);

Si vous remplacez le: ,cursor:"move"} par:

Code:
        opt = $.extend({handle:"",cursor:"fixe"}, opt);

Sa marcherais surement, je continue à analysé le code ...
avatar

Shawn ModdingGaming
***

Masculin
Messages : 183
Inscrit(e) le : 04/11/2016

https://fslogging.forumactif.com
Shawn ModdingGaming a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par cedric03 le Ven 23 Déc 2016 - 16:34

pour le moment ça n'a encore rien changé

mon texte est toujours a gauche ,ds chrome ,firefox et Edge

je vous remercie pour tous vos efforts
avatar

cedric03
Nouveau membre

Messages : 14
Inscrit(e) le : 20/12/2016

http://planetegraphisme.creationforum.net
cedric03 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par lilas le Ven 23 Déc 2016 - 18:22

@Shawn ModdingGaming a écrit:Ou le mieux installez aussi Chrome sur votre ordi: Navigateur Chrome, cela vous ferais gagner du temps !!! Wink
Je n'impose pas de navigateurs à mes membres... Rolling Eyes Chrome est installé sur mon PC principal...

J'ai opté pour le Javascript et en modifiant avec ce que vous suggérez le problème persiste... What's happen ?!?
Belle fin de journée forum

Lunette

avatar

lilas
*****

Féminin
Messages : 805
Inscrit(e) le : 07/08/2004

http://lefofodemacopine.forumactif.com/
lilas a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par oxymore le Mar 27 Déc 2016 - 13:35

Bonjour

Essayez en mettant
Code:
after
à la place de
Code:
before
dans cette partie du code
Code:
$( document ).ready(function() {
$('.post-options:first').before('<div id="myDiv" style="margin-top:8px;"><img src="http://www.icone-png.com/png/22/21757.png" /></div>');
$('#myDiv').drags();
 
});
avatar

oxymore
***

Messages : 141
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par cedric03 le Mar 27 Déc 2016 - 14:22

bonjour Oxymore

en effet j'ai effectuer quelques petits changements sur ton script

au lieu de before j'ai mis after

puis je suis revenu a before et j'ai changer et a la place de "post-options:first " j'ai mis ""postbody ""


Code:
$('.postbody').before('<div id="myDiv" style="margin-top:25px;">

je crois qu'on peut encore améliorer

avatar

cedric03
Nouveau membre

Messages : 14
Inscrit(e) le : 20/12/2016

http://planetegraphisme.creationforum.net
cedric03 a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par oxymore le Mar 27 Déc 2016 - 14:35

Bonjour Cedric

On peut effectivement modifier cette partie du code qui définit l'emplacement pour placer l'image et les possibilités sont nombreuses ,-)
avatar

oxymore
***

Messages : 141
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par cedric03 le Mar 27 Déc 2016 - 14:44

oui les possibilités sont nombreux mais mon javascript est très limité
avatar

cedric03
Nouveau membre

Messages : 14
Inscrit(e) le : 20/12/2016

http://planetegraphisme.creationforum.net
cedric03 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Cherche Sript pour déplacer un objet (stylo ou flèche) dans un cours

Message par Chacha le Lun 2 Jan 2017 - 10:26

Bonjour,

Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
avatar

Chacha
Modéractif
Modéractif

Masculin
Messages : 55103
Inscrit(e) le : 21/08/2010

http://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum