begin process at 2012 05 28 14:21:09
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Fenêtre & Pop-up

 > UNE PETITE IMAGE VAUT MIEUX QU'UN LONG DISCOUR

UNE PETITE IMAGE VAUT MIEUX QU'UN LONG DISCOUR


 Information sur la source

Note :
9 / 10 - par 3 personnes
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Fenêtre & Pop-up Niveau :Débutant Date de création :29/06/2005 Date de mise à jour :12/09/2005 14:12:44 Vu :11 164
Auteur : Phil_Free

Ecrire un message privé
Site perso
Commentaire sur cette source (5)
Ajouter un commentaire et/ou une note

 Description

Cette petite fonction "transferview" vous permettra d'afficher un petit pop-up ne contenant qu'une image.

Son utilité, par exemple:

- Illustrer graphiquement un mot ou une expression complexe,
- Afficher une portion zoomée d'une image,
- etc.

Les paramètres de la fonction sont:
image  : le nom et le chemin de l'image à afficher par exemple repertore/image.jpg
largeur: la largeur de l'image
hauteur: la hauteur de l'image
titre  : le titre du pop-up

Son utilisation:

Dans votre code HTML, ajoutez par exemple:

<a href="javascript:transferview('repertoire/monimage .jpg',400,400,'titre de la fenetre')">expression complexe</a>

Dans ce cas l'image servira à expliquer l'"expression complexe"

Source

  • function transferview( image , largeur , hauteur , titre ) {
  • var s1 = "<html>\n<head>\n<title>" + titre + "</title>\n</head>\n" ; //balises HTML du Popup
  • var s2 = "<body>\n" ;
  • var s3 = "<img src='" + image + "' border=0>\n" ;
  • var s4 = "</body>\n</html>" ;
  • if ( largeur == 0 ) larg=" " ; //test largeur et-ou hauteur nulle
  • else larg = "width="+ ( largeur + 20 ) + "" ;
  • if ( hauteur == 0 ) haut=" " ;
  • else haut = "height="+ ( hauteur + 20 ) + "" ;
  • var dim = larg + "," + haut + "," ;
  • // ouverture du popup
  • ImageWindow=window.open("about:blank","newwin", dim + "toolbar=no,scrollbars=no,menubar=no,resizable=no,status=no,location=no");
  • // ecriture dans le popup
  • ImageWindow.document.write( s1 + s2 + s3 + s4 );
  • // IMPORTANT il faut TOUJOURS faire document.close() sinon le browser tourne en continu
  • ImageWindow.document.close();
  • }
  • .
  • .
  • .
  • <a href="javascript:transferview('repertoire/monimage.jpg',476,463,'titre de la fenetre')">expression complexe</a>
  • .
  • .
  • . 
function transferview( image , largeur , hauteur , titre ) {

var s1 = "<html>\n<head>\n<title>" + titre + "</title>\n</head>\n" ; //balises HTML du Popup
var s2 = "<body>\n" ;
var s3 = "<img src='" + image + "' border=0>\n" ;
var s4 = "</body>\n</html>" ;

if ( largeur == 0 ) larg=" " ;	//test largeur et-ou hauteur nulle

	else larg = "width="+ ( largeur + 20 ) + "" ;

if ( hauteur == 0 ) haut=" " ;

	else haut = "height="+ ( hauteur + 20 ) + "" ;

var dim = larg + "," + haut + "," ;	

// ouverture du popup
ImageWindow=window.open("about:blank","newwin", dim + "toolbar=no,scrollbars=no,menubar=no,resizable=no,status=no,location=no");

// ecriture dans le popup
ImageWindow.document.write( s1 + s2 + s3 + s4 );

// IMPORTANT il faut TOUJOURS faire document.close() sinon le browser tourne en continu
ImageWindow.document.close();

}

.
.
.
 
<a href="javascript:transferview('repertoire/monimage.jpg',476,463,'titre de la fenetre')">expression complexe</a>
 
.
.
.

 Conclusion

Testé sous IE et FireFox.


 Historique

29 juin 2005 23:31:58 :
petite modif du descriptif
30 juin 2005 16:54:33 :
Balises HTML en minuscules selon recommandations de Sa Sainteté W3C
12 septembre 2005 14:12:44 :
Ajout d'un commentaire dans la source.

 Sources du même auteur

Source avec une capture VÉRIFICATION D'UN FORMULAIRE EN TEMPS RÉEL
Source avec une capture MENU DYNAMIQUE VERTICAL PARAMÉTRABLE
Toutes les sources de Phil_Free

 Sources de la même categorie

Source avec Zip Source avec une capture MYNOTIFICATIONS par inwebo
Source avec Zip Source avec une capture POSMOUSE - AFFICHAGE DES COORDONNÉES DE LA SOURIS, TAILLE DE... par phidelum
SFR WIDGET ET JQUERY par hhoareau
Source avec Zip JOLIE ALERTE AVEC "ALERT()" par heycraft
Source avec Zip Source avec une capture FENETRE D'ACTUALITE par kazma
Toutes les sources de la catégorie Fenêtre & Pop-up

Commentaires et avis

Commentaire de garfield90 le 30/06/2005 16:33:12

Tu viens de recréer window.open !!!!

Comment pourrais je noté un hello world?
0

De plus

# var s1 = "<html><head><TITLE>" + titre + "</TITLE></head>" ; //balises HTML du Popup
# var s2 = "<body>" ;
# var s3 = "<CENTER><IMG SRC='" + image + "' BORDER=0>" ;
# var s4 = "</CENTER></body></html>" ;

sont inutiles.

var s1 = "le contenu de s1 +s2 +s3 +s4, j'ai la flemme de faire un pomper coller"

on ne parle pas du code html qui ne respecte pas les normes

manquerait plus que ca ne marche pas sous IE et FF, c'est une joke j'espère. ;)

Commentaire de Phil_Free le 30/06/2005 16:46:34

Hey Garfield,

Je n'ai pas dit que c'était la quintessence de JavaScript.

Comme je vois souvent des questions concernant window.open sur le forum, je me suis dit qu'un petit exemple de fonction ne serait pas superflue.
La prochaine fois qu'une telle question est posée, j'indique le lien c'est plus court.

Pour ce qui est des balises, elles ont leur utilité si tu veux complèter le pop-up avec du texte ou un tableau. Donc je ne les ai pas sucrées.

Et puis, dis moi ce qui te chagrine dans mon HTML, je corrigerai pour que tu ne nous fasse pas une crise d'urticaire ;)

Commentaire de garfield90 le 30/06/2005 17:04:42

Salut,

balise en majuscule pas cool
les attributs se mettent entre guillemets et non apostrophe.

Pour ce qui est de l'utilisation de window.open, il n'ont qu'a recherche un peu dans les documents sur le javascript (tout est dedans).

Le meilleur moyen d'apprendre c'est de chercher, un fois que tu as pu trouver tu sera de nouveau capable de le refaire ou de le rechercher.

Je ne dis pas de ne pas explique un script difficile mais faire un explication sur une fonction de base de javascript, je trouve ca inutile, inaproprié et interessant pour qui que ce soit


De plus, ta fonction est moins performante que la fonction de base ;)

Sans rancune, c'est juste mon avis

Commentaire de Pascail le 22/07/2005 11:04:57

Le but de tous les utilisateurs de ce site, ce n'est pas de devenir des as incontestés dans la totalités des language existants. Le plus souvent, ce qu'on cherche, c'est des bouts de code qui correspondent à ce qu'on veut pour notre site. Personnellement, je cherchait un moyen simple d'ouvrir des Popup avec mes images, popup qui prendraient la taille de l'image, tout automatiquement. N'ayant aucune connaissance du Javascript (et en ayant un peu rien à foutre)(troll, troll troll), ce code source arrive comme un cadeau du ciel :)

Donc, code source, c'est un site de code source, et il faut selon moi, des codes pour toutes les  utilisations, de l'honteux pompeur (moi) à l'honorable padawan qui apprends tant bien que mal.

Et puis, j'aime bien les hello world.

Commentaire de Phil_Free le 12/09/2005 14:15:58

Merci du commentaire Pascail.

Heureux que ce petit bout de code te soit utile.

 Ajouter un commentaire

Nos sponsors


Sondage...

Comparez les prix


Mio - Moov V735 - GPS Europe - Ecran 7"
Entre 305€ et 375€

Visiter le guide achat

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

Photo Waterfall in Kauai Hawaii With RainbowPhoto Beautiful El Capitan Yosemite National Park
Photo Herbstwald im Gegenlicht 

Visiter la photothèque

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 5,663 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)