11544 sujets

JavaScript, DOM et API Web HTML5

Bonsoir,
Je créé actuellement un site et j'ai envie d'intégrer dans le pied de page un bloc qui contiendrait le logo de mon site précédé de "création de". Voilà, sauf que je veux pouvoir (au cas où ça serait nécessaire) pouvoir modifier ce bloc, sauf que je n'aurais pas toujours la main sur le fichier html ! donc j'ai d'abord pensé tout simplement à un iframe mais... trop instable selon les navigateurs. Donc je me suis dis que je n'avais qu'à créer une div dont le propriétés serait définies par un fichier css externe au serveur du site et que je pourrait modifier. Maintenant le problème, c'est le lien: si mon adresse change, bah je suis un peu dans la Smiley langue . Donc j'ai eu l'idée du javascript, sauf que de la même manière que le fichier .css, je voudrais avoir un fichier .js externe au serveur que je pourrait modifier, ce fichier contiendrait donc le lien auquel redirigerait le bloc sur le site... compliqué hein !!

Pour résumer: j'ai un fichier.js sur le serveur de mon site, j'ai une balise <a> sur le site que je fais, et le fichier.js doit pouvoir influer sur l'adresse du lien de la balise <a>.

Je pense que ça doit être très simple mais je ne connais strictement rien au javascript et tout les forums sur lesquels je suis tombé explique quelque chose qui n'a rien avoir avec onclick="jesaispasquoi" ou href="javascript:functionmachin", bon bref je ne comprend rien.

Voilà tout, merci à vous !
Modifié par juliendargelos (15 Mar 2015 - 18:46)
Bonjour,
Il ne faut pas confondre le java et le javascript. Le javascript possède une extension en .js et non pas .jar lui est pour une application java.

Tu peux en effet utiliser un fichier js externe que tu appelerais comme ceci:

<script type='text/javascript' src='http://www.tondomaine.com/lien.js'></script>


Et dedans faire un innerHTML(); ou un document.write(); mais attention à ne pas écraser le code du site.

A+
Bonjour à toutes et à tous,

je n'ai pas tout compris de ce que tu veux faire, mais en gros, tu as :

1) <div id="footer"></div> quelque part dans une page HTML.
2) tu désires mettre une image (le logo de ta société)
3) un lien <a href="#">lien vers un autre site</a>
4) peut-être autre chose (reste à définir).

Et le tout d'une manière dynamique.

Par contre, ce que je n'arrive pas à comprendre, c'est que tu n'as pas la main sur le site ?
Donc comment comptes-tu faire le lien vers ce site ? A partir d'un autre site, je suppose.

Peux-tu être un peu plus explicite sur ce que tu veux faire ?
Surtout sur le point où tu n'as pas la main, c'est à dire sur le site où tu désires afficher ton logo.

Si j'ai bien compris ce que tu veux faire, cette image et ce lien concerne l'identification du concepteur du site, c'est à dire toi !

@+
Je consent que c'est très certainement un peu compliqué comme explication:

Je construis un site web, seulement, une fois le projet fini, je n'aurais plus accès au serveur, je veux donc pouvoir modifier un élément du site extérieurement au serveur, voilà voilà.

WebD, autant être clair: je ne sait tout simplement pas coder en javascript, je veux bien dire aucunes connaissance ! Que dois-je écrire dans lien.js ??
Bonsoir xXjujo002Xx,

pour réaliser ce que tu veux faire, il faut un point fixe dans la page HTML.
Entre autre <div id="footer"><\div> fera très bien l'affaire.

Dans le header de la page HTML, tu mets :
<link type="text/css" rel="steelsheet" href="http://www.tondomaine.com/Styles.css" />
<script type='text/javascript' src="http://www.tondomaine.com/Script.js/"></script>


Mais tu ne m'as pas répondu sur ce que tu veux mettre dans la balise <div> ?

@+
Oui j'avais déjà compris que j'allais procéder de cette manière, le problème était juste de savoir quoi mettre dans mon fichier .js

Dans cette div sera le logo de mon site qui agira comme lien.
Modifié par juliendargelos (15 Mar 2015 - 18:47)
Re bonsoir xXjujo002Xx,

indique moi en html et en css ce que tu veux mettre dans <div id="footer"></div> à l'identique de ce que tu veux voir apparaitre.

@+
Modifié par Artemus24 (28 Apr 2012 - 01:18)
Partie CSS:

#pixcreate {
       background:url('http://www.pixcreate.com/medias/logo.png');
       width:100;
       height:30;
       margin:0 auto 0 auto;
}


Partie html:

<html>
       <head>
              <link rel="stylesheet" src="http://www.pixcreate.com/style.css" type="text/css"/>
              <script type="text/javascript" scr="http://www.pixcreate.com/scripts/lien.js"></script>
       </head>
       <body>
              <a id="pixcreate" href="fonction-lien"></a>
       </body>
</html>

Modifié par xXjujo002Xx (28 Apr 2012 - 01:32)
Bonsoir xXjujo002Xx,

voici une ébauche assez simpliste de ce que tu demandes. A demain !

Le code HTML :
<!doctype html>
<html>
<head>
<!-- ==== -->
<!-- Meta -->
<!-- ==== -->

<meta http-equiv="Content-Type"        content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type"  content="text/css" />

<title>comment insérer une image dans un lien dynamiquement</title>

<!-- ========== -->
<!-- JavaScript -->
<!-- ========== -->

<script src="Script.js" type="text/javascript"></script>

<!-- ====================== -->
<!-- Cascading Style Sheets -->
<!-- ====================== -->

<style rel="stylesheet" type="text/css">
body {	background-color	: maroon;	}
</style>

<link href="Styles.css" rel="stylesheet" type="text/css" />
</head>

<body>
	<div id="footer"></div>
</body>
</html>


Le code CSS :
/*==============================*/
/*     La Feuille de Styles     */
/*==============================*/

#footer {
		margin				: 0;
		padding				: 0;
		border				: 0 none;
}

#footer a {
		margin				: 0 auto;
}

#footer a img {
		width				: 256px;
		height				: 192px;
}


Le code Javascript :
window.onload   = function ()	{Pied.Init();}

/****************************************/
/*                                      */
/*     Construction du pied de page     */
/*                                      */
/****************************************/

Pied = {

node : null,			/* noeud : pied de page */
image: null,			/* noeud : image        */
lien : null,			/* noeud : lien         */

/*========================================*/
/*     initialisation du pied de page     */
/*========================================*/

Init: function ()
{
	/*-----------------------------------------------*/
	/*     Recherche de la balise "pied de page"     */
	/*-----------------------------------------------*/

	this.node = document.getElementById("footer");

	/*----------------------------------------*/
	/*     Création de la balise "anchor"     */
	/*----------------------------------------*/

	this.lien = document.createElement("a");

	this.lien.setAttribute("id" ,    "pixcreate");
	this.lien.setAttribute("href" ,  "http://www.google.fr/");
	this.lien.setAttribute("target", "_blank");
	this.lien.setAttribute("title",  "mon site");

	/*---------------------------------------*/
	/*     Création de la balise "image"     */
	/*---------------------------------------*/

	this.image = document.createElement("img");

	this.image.setAttribute("src" , "http://jquery.com/demo/thickbox/images/plant4.jpg");
	this.image.setAttribute("alt" , "chez moi");

	/*----------------------------------------------------*/
	/*     Insertion de la balise "image" dans "lien"     */
	/*----------------------------------------------------*/

	this.lien.appendChild(this.image);

	/*-----------------------------------------------------------*/
	/*     Insertion de la balise "lien" dans "pied de page"     */
	/*-----------------------------------------------------------*/

	this.node.appendChild(this.lien);
}

};


@+