11488 sujets

JavaScript, DOM et API Web HTML5

Salut,

Tu peux utiliser un framework javascript comme Jquery ou Prototype, utiliser un plugin type lightbox ou slimbox. Après avec le framework rendre ces box draggables. Tout dépend maintenant ce que tu veux afficher dans cette petit boite ^^
N-J a écrit :
Salut,

Tu peux utiliser un framework javascript comme Jquery ou Prototype, utiliser un plugin type lightbox ou slimbox. Après avec le framework rendre ces box draggables. Tout dépend maintenant ce que tu veux afficher dans cette petit boite ^^



Merci N-J,
J'ai vu slimbox et ça me parait très bien comme base.
Reste plus qu'à comprendre le framework dont tu parles car c'est flou pour moi.

As-tu un exemple ?


Sinon j'aimerais y mettre soit une page, soit un bout de code.
Modifié par shiver (09 Sep 2009 - 12:57)
Tu peux aller sur : http://www.nicolas-juen.fr j'ai utilisé la slimbox pour la présentation de mes images.

Pour le framework, c'est en fait une gros fichier javascript qui te permet d'utiliser le javascript facilement et compatible avec tous les navigateurs.
Le framework utilisé est Mootools, il y a une documentation seul leur site si tu en as besoin.
N-J a écrit :
Tu peux aller sur : http://www.nicolas-juen.fr j'ai utilisé la slimbox pour la présentation de mes images.

Pour le framework, c'est en fait une gros fichier javascript qui te permet d'utiliser le javascript facilement et compatible avec tous les navigateurs.
Le framework utilisé est Mootools, il y a une documentation seul leur site si tu en as besoin.



Je vois ta page et c'est exactement ce que j'ai téléchargé : Slimbox 2.
Cependant, c'est prévu pour charger une image alors que je charge une page dans ce div.

J'aimerais charger une page avec la taille qui passe dans une url.

exemple :

<a href="http://www.site.com?page=4l51mm9g6e5044v8aw80&largeur=500&hauteur=400" rel="lightbox">Clic pour ouvrir</a>


Il m'ouvrira donc une div qui contient la page de 500x400 px.

Est-ce possible ?


EDIT : j'ai trouvé...
Modifié par shiver (09 Sep 2009 - 15:14)
J'ai réussi à mettre une iframe avec largeur variable.
Cependant, je galère toujours pour réussir à bouger la div.

J'ai regardé drag.move mais j'ai franchement du mal à intégrer mootools à tout ça.
N-J a écrit :
Au lieu de mettre une iframe tu peux utiliser du javascript :
http://mootools.net/docs/core/Request/Request.HTML.

Pour le draggable les exemples sont simples ici par exemple où tu as accès au code html/css/js, n'oublie pas que tu dois ajouter le 'more' de la librairie mootools quand tu le télécharges Smiley cligne



Merci pour les infos, mais j'ai encore un peu de mal à comprendre comment intégrer tout ça pour l'utilisation.

J'ai chargé les .js de more necessaires et la base, avec code js dans le head de la page, css idem et html mais rien ne fonctionne.

l'appel de la div se fait comme ça :

echo "<a href=\"http://www.site.com/page?code=".$code."&largeur=".$largeur."&hauteur=".$hauteur."\" rev=\"width=".$largeur.", height=".$hauteur."\" rel=\"lightbox[params_sample]\" title=\"\">ouvrir page dans bloc</a>";


Ca ouvre bien la page dans un div à la bonne taille indiquée dans l'url.
Je n'arrive pas à la déplacer avec le drag.move de mootools.

Si quelqu'un sait comment faire...

Merci
Modifié par shiver (10 Sep 2009 - 22:47)