FENETRES DÉPLACABLES ET REDIMENSIONNABLE PAR LA SOURIS
XtremDuke
Messages postés626Date d'inscriptionsamedi 28 septembre 2002StatutMembreDernière intervention18 mai 2009
-
26 sept. 2008 à 18:02
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009
-
24 août 2009 à 08:28
Cette discussion concerne un article du site. Pour la consulter dans son contexte d'origine, cliquez sur le lien ci-dessous.
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 24 août 2009 à 08:28
Bonjour MetalDark & Fenri,
je en vois pas trop en quoi ouvrir une fenêtre via un simple liens ou bouton est un problème.
Il suffit de créer une fonction qui créer une fenêtre et de l'appelé sur le "onclick" d'un bouton ou dans un simple lien :
<script>
function showGoogle(){
CreerPdcFenetre( "305", 500, 200, 350, 150, "[javascript:showGoogle(); Google !]
Voilà c'est aussi simple que ça... Après si vous voulez charger les fenêtres a la création de la page et (juste) les afficher après, va falloir modifier un peu le code pour que les "fenêtre" soit créées avec "display: none" puis créer une fonction qui va les ré-afficher.
Voilà j'espère que j'ai répondu à vos questions et merci pour la note Fenri (au passage je serai curieux de voir ce que ça donne avec un style Vista sur les fenêtres...).
Fenri
Messages postés5Date d'inscriptionjeudi 2 avril 2009StatutMembreDernière intervention17 novembre 2009 22 août 2009 à 12:18
Salut,
Ton code est vraiment tres bien et utile ! Bravo a toi ! (J'ai adapté un theme Vista sur les fenetres) Le rendu est tres joli ;) ! Ce ci étant dit, j'ai quand meme un petit soucis ... (qui a dailleur deja était posé ^^') J'aurais besoin de ton aide precieuse pour trouver le moyen de creer une fenetre en apuiyant sur un bouton ou un lien. Merci d'avance et encore une fois bravo !
metaldark00
Messages postés1Date d'inscriptionsamedi 6 octobre 2007StatutMembreDernière intervention15 août 2009 15 août 2009 à 18:41
ya t'il un moyen d'ouvrir l'une de ces fenêtres en appelant la la fonction avec un simple lien
bibi5757
Messages postés2Date d'inscriptionmercredi 8 avril 2009StatutMembreDernière intervention23 mai 2009 23 mai 2009 à 16:45
Dans mon cas, au final, je n'utilise pas les scrollbars donc je n'ai pas plus d'info. Merci encore, j'avance bien grace à toi. J'ai même créé une case à cocher pour afficher ou non la fenêtre:
<script>
function affiche_boite_a_outils(){
if (document.activite.visibilite_boite_a_outils.checked)
{
document.getElementById("PdcFenetre").style.visibility="visible";
}
else
{
document.getElementById("PdcFenetre").style.visibility="hidden";
}
}
</script>
Code HTML:
Boite à outil
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 22 mai 2009 à 09:19
bibi5757, Merci et désolé pour les fautes d'orthographe... C'est pas trop mon fort...
Sinon pour les Scrollbars sous FireFox il me semble que c'est Firefox lui même qui ne le gère pas. Je peu me tromper, mais je ne crois pas que ce soit possible.
bibi5757
Messages postés2Date d'inscriptionmercredi 8 avril 2009StatutMembreDernière intervention23 mai 2009 22 mai 2009 à 02:49
Salut PDC_666,
du même avis que BOBOSS74, plus des constantes très utiles.
je vais m'inspirer de cette source pour créer une boite à outil "BBCode" pour le site d'une asso.
C'est exactement ce dont j'avais besoin.
Merci beaucoup et que cette source soit encore utile à beaucoup de monde.
Une toute petite chose, la mise en couleurs personnalisée des scrollbars ne fonctionnent pas sous FF 3.0.10, mais je ne me suis pas encore penché sur la question, et quelques fautes d'orthographe dans les commentaires ^^
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 4 mai 2009 à 17:52
Salut boboss74,
merci pour ton commentaire et heureux de voir que mon code sert encore ;) ...
Enfin un script correct dans le domaine ! Code très propre et vraiment bien commenté.
Merci beaucoup :)
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 20 oct. 2008 à 09:01
Salut nicolas,
la source est libre tu peu en faire ce qu'il te plais ! Mais si ma source est réalisable à 3/4 grace à un tuto c'est domage pour toi, si tu veux mieux connaitre le JS, de ne pas essayé de réaliser la même chose toi meme. :)
Nicolas___
Messages postés992Date d'inscriptionjeudi 2 novembre 2000StatutMembreDernière intervention24 avril 20131 19 oct. 2008 à 16:18
ta source m'a donné envie de connaitre plus sur le js et c'est dommage que les 3/4 des idées de cette source soit sur un tuto sur le site du zero ...
Nicolas___
Messages postés992Date d'inscriptionjeudi 2 novembre 2000StatutMembreDernière intervention24 avril 20131 18 oct. 2008 à 17:05
Salut pdc_666 ,
dis est ce que ta source est libre de droit ?
Peut on l'utiliser pour faire un site web ?
Sinon superbe , je ne savais pas qu'on savait faire ca en js ... mais j'y connais pas grand chose en même temps ^^
Ciao
Nico
djmmix
Messages postés152Date d'inscriptionlundi 28 juillet 2003StatutMembreDernière intervention29 avril 2009 7 oct. 2008 à 17:25
je vien de tester chapeau, nikel sous IE7 et FF3 bravo :)
@karamel
Messages postés1850Date d'inscriptionvendredi 9 mai 2008StatutModérateurDernière intervention 4 mars 2024152 30 sept. 2008 à 21:23
l'amélioration est tres perceptible le deplacement des fenetres est devenu fluide donc je ne dirait qu'une chose félicitation.
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 30 sept. 2008 à 18:17
Encore une chose que je n'ai pas précisé, j'ai également le dépassement de la taille dans le titre.
Si le titre est trop long pour la taille de la fenetre, il est coupé (même principe que pour le contenu overflow=hidden).
Si j'ai le temps je ferai peu etre mon "perfectionniste" en rajoutant "..." a la fin du titre dans ce cas. Mais je sens que ça va être beaucoup de code pour pas grand chose... à suivre.
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 30 sept. 2008 à 18:14
J'ai oublié de préciser lors de la mise à jour : Merci XtremDuke pour tes conseils ! :)
bbcluny
Messages postés66Date d'inscriptionmardi 25 mars 2003StatutMembreDernière intervention29 septembre 2008 29 sept. 2008 à 09:54
Source interressante
XtremDuke
Messages postés626Date d'inscriptionsamedi 28 septembre 2002StatutMembreDernière intervention18 mai 20094 28 sept. 2008 à 11:06
DJIMMIX > je suis tout à fait d'accord avec tes remarques, cependant rien ne t'empêche d'aller jetter un coup d'œil sur ces frameworks afin de comprendre certains fonctionnements.
Cependant, utiliser un timer pour le déplacement est complètement inutile. Voilà en gros le fonctionnement classique d'un drag'n drop :
1 - "mousedown" sur la fenetre à déplacer :
* Ajout de l'événement "mousemove" à l'objet "document"
* Ajout de l'événement "mouseup" à l'objet "document"
* Récupération des coordonnées du pointeurs
2 - "mousemove" de l'objet "document" :
* Déplacement de la fenêtre (en fonction des coordonnées du pointeur)
* Annulation de l'évènement "mouvemove" (éviter l'effet de surlignement)
3 - "mouseup" sur l'objet "document" :
* Suppression des évènements "mousemove" et "mouseup" de l'objet "document"
Il peut y avoir quelques variantes mais voilà en gros le principe.
Je te conseilles aussi de jeter un œil sur le gestionnaire d'événement de javascript.
A+
cs_petifa
Messages postés215Date d'inscriptiondimanche 20 février 2005StatutMembreDernière intervention10 mars 2014 27 sept. 2008 à 18:06
oui certe je dis pas le contraire, moi aussi ça nm'arrive de réinventer la roue mais bon je faisais remarquer
djmmix
Messages postés152Date d'inscriptionlundi 28 juillet 2003StatutMembreDernière intervention29 avril 2009 27 sept. 2008 à 13:46
PETIFA: le but de sa source comme d'autre c'est d'évité d'utiliser les SDK deja tout fait ....
sinon t'apprend rien
et personnelement je suis pas ppour les SDK deja trop lourde pour les utilisation qu'on en fait et perso vaut mieux développer une fonction classe personel qui sera pour un projet precis que d'avoir un SDK lourd pour le peu de fonction appeler.
cs_petifa
Messages postés215Date d'inscriptiondimanche 20 février 2005StatutMembreDernière intervention10 mars 2014 27 sept. 2008 à 11:49
il y a des bibliothèques pour ça, prototype par exemple, et c'est compatible firefox...
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 27 sept. 2008 à 00:28
Bonjour kazma,
en fait ma source n'est pas fini encore c'est pour ça que le résultat n'est pas encore térrible. Le but étant plus de faire une petite librairie qu'une simple source à tire d'exemple.
J'ai posté ma source sans qu'elle soit fini pour avoir de l'aide car je n'ai pas une grosse expérience du javascript.
En tout cas bravo pour ta source ça marche nikel.
@karamel
Messages postés1850Date d'inscriptionvendredi 9 mai 2008StatutModérateurDernière intervention 4 mars 2024152 26 sept. 2008 à 19:45
bonjour
ayant mois meme fait une source du meme type je trouve la source tecnique pour un resutat mitige.
bon debogage
pdc_666
Messages postés19Date d'inscriptionmardi 13 janvier 2004StatutMembreDernière intervention24 août 2009 26 sept. 2008 à 19:25
Salut XtremDuke si tu regarde dans la description j'ai bien spécifié que la source n'est pas encore compatible mais c'est prévu ! J'ai pas encore eu le temps.
Pour la saccade je pense qu'il suffit de réduire l'intervale des appel à la fonction PdcFenetreMove() (actuellement 20 ms).
Et dernièrement pour la selection de texte j'ai desespérement essayé de le faire sans succèes. Il faut retourné False lors d'un appel à une fonction event c'est bien ça? Mais lequel?
XtremDuke
Messages postés626Date d'inscriptionsamedi 28 septembre 2002StatutMembreDernière intervention18 mai 20094 26 sept. 2008 à 18:02
Salut,
Ton script ne fonctionne pas sous firefox et le déplacement semble saccader.
Tu devrais aussi stopper la propagation de tes évènements afin de ne pas avoir l'effet de sélection lorsqu'on passe une fenetre au dessus d'un texte.
24 août 2009 à 08:28
je en vois pas trop en quoi ouvrir une fenêtre via un simple liens ou bouton est un problème.
Il suffit de créer une fonction qui créer une fenêtre et de l'appelé sur le "onclick" d'un bouton ou dans un simple lien :
<script>
function showGoogle(){
CreerPdcFenetre( "305", 500, 200, 350, 150, "[javascript:showGoogle(); Google !]
Voilà c'est aussi simple que ça... Après si vous voulez charger les fenêtres a la création de la page et (juste) les afficher après, va falloir modifier un peu le code pour que les "fenêtre" soit créées avec "display: none" puis créer une fonction qui va les ré-afficher.
Voilà j'espère que j'ai répondu à vos questions et merci pour la note Fenri (au passage je serai curieux de voir ce que ça donne avec un style Vista sur les fenêtres...).
22 août 2009 à 12:18
Ton code est vraiment tres bien et utile ! Bravo a toi ! (J'ai adapté un theme Vista sur les fenetres) Le rendu est tres joli ;) ! Ce ci étant dit, j'ai quand meme un petit soucis ... (qui a dailleur deja était posé ^^') J'aurais besoin de ton aide precieuse pour trouver le moyen de creer une fenetre en apuiyant sur un bouton ou un lien. Merci d'avance et encore une fois bravo !
15 août 2009 à 18:41
23 mai 2009 à 16:45
<script>
function affiche_boite_a_outils(){
if (document.activite.visibilite_boite_a_outils.checked)
{
document.getElementById("PdcFenetre").style.visibility="visible";
}
else
{
document.getElementById("PdcFenetre").style.visibility="hidden";
}
}
</script>
Code HTML:
Boite à outil
22 mai 2009 à 09:19
Sinon pour les Scrollbars sous FireFox il me semble que c'est Firefox lui même qui ne le gère pas. Je peu me tromper, mais je ne crois pas que ce soit possible.
22 mai 2009 à 02:49
du même avis que BOBOSS74, plus des constantes très utiles.
je vais m'inspirer de cette source pour créer une boite à outil "BBCode" pour le site d'une asso.
C'est exactement ce dont j'avais besoin.
Merci beaucoup et que cette source soit encore utile à beaucoup de monde.
Une toute petite chose, la mise en couleurs personnalisée des scrollbars ne fonctionnent pas sous FF 3.0.10, mais je ne me suis pas encore penché sur la question, et quelques fautes d'orthographe dans les commentaires ^^
4 mai 2009 à 17:52
merci pour ton commentaire et heureux de voir que mon code sert encore ;) ...
4 mai 2009 à 17:40
Merci beaucoup :)
20 oct. 2008 à 09:01
la source est libre tu peu en faire ce qu'il te plais ! Mais si ma source est réalisable à 3/4 grace à un tuto c'est domage pour toi, si tu veux mieux connaitre le JS, de ne pas essayé de réaliser la même chose toi meme. :)
19 oct. 2008 à 16:18
18 oct. 2008 à 17:05
dis est ce que ta source est libre de droit ?
Peut on l'utiliser pour faire un site web ?
Sinon superbe , je ne savais pas qu'on savait faire ca en js ... mais j'y connais pas grand chose en même temps ^^
Ciao
Nico
7 oct. 2008 à 17:25
30 sept. 2008 à 21:23
30 sept. 2008 à 18:17
Si le titre est trop long pour la taille de la fenetre, il est coupé (même principe que pour le contenu overflow=hidden).
Si j'ai le temps je ferai peu etre mon "perfectionniste" en rajoutant "..." a la fin du titre dans ce cas. Mais je sens que ça va être beaucoup de code pour pas grand chose... à suivre.
30 sept. 2008 à 18:14
29 sept. 2008 à 09:54
28 sept. 2008 à 11:06
Cependant, utiliser un timer pour le déplacement est complètement inutile. Voilà en gros le fonctionnement classique d'un drag'n drop :
1 - "mousedown" sur la fenetre à déplacer :
* Ajout de l'événement "mousemove" à l'objet "document"
* Ajout de l'événement "mouseup" à l'objet "document"
* Récupération des coordonnées du pointeurs
2 - "mousemove" de l'objet "document" :
* Déplacement de la fenêtre (en fonction des coordonnées du pointeur)
* Annulation de l'évènement "mouvemove" (éviter l'effet de surlignement)
3 - "mouseup" sur l'objet "document" :
* Suppression des évènements "mousemove" et "mouseup" de l'objet "document"
Il peut y avoir quelques variantes mais voilà en gros le principe.
Je te conseilles aussi de jeter un œil sur le gestionnaire d'événement de javascript.
A+
27 sept. 2008 à 18:06
27 sept. 2008 à 13:46
sinon t'apprend rien
et personnelement je suis pas ppour les SDK deja trop lourde pour les utilisation qu'on en fait et perso vaut mieux développer une fonction classe personel qui sera pour un projet precis que d'avoir un SDK lourd pour le peu de fonction appeler.
27 sept. 2008 à 11:49
27 sept. 2008 à 00:28
en fait ma source n'est pas fini encore c'est pour ça que le résultat n'est pas encore térrible. Le but étant plus de faire une petite librairie qu'une simple source à tire d'exemple.
J'ai posté ma source sans qu'elle soit fini pour avoir de l'aide car je n'ai pas une grosse expérience du javascript.
En tout cas bravo pour ta source ça marche nikel.
26 sept. 2008 à 19:45
ayant mois meme fait une source du meme type je trouve la source tecnique pour un resutat mitige.
bon debogage
26 sept. 2008 à 19:25
Pour la saccade je pense qu'il suffit de réduire l'intervale des appel à la fonction PdcFenetreMove() (actuellement 20 ms).
Et dernièrement pour la selection de texte j'ai desespérement essayé de le faire sans succèes. Il faut retourné False lors d'un appel à une fonction event c'est bien ça? Mais lequel?
26 sept. 2008 à 18:02
Ton script ne fonctionne pas sous firefox et le déplacement semble saccader.
Tu devrais aussi stopper la propagation de tes évènements afin de ne pas avoir l'effet de sélection lorsqu'on passe une fenetre au dessus d'un texte.