all html : Le portail des webmaster

liste des forums liste des discussions Participer à la discussion

Message publié le samedi 17 mai 2008 à 13 h 03 par Fury161.

Bonjour à tous !

Je me permets de reprendre une partie de ma réponse à LDL d'un autre topic ayant dévié vers 2 interrogations sur "Blogger" / "Blogspot". Si l'un(e) d'entre vous connais la plateforme "Blogger", peut-être que quelqu'un pourrait me filer un fier coup de main...

1) Les cadres blancs automatiques autour des photos...

Pourquoi est-ce que, sur "Blogger", par défaut, toutes les insertions photos-images sont pourvues de cadres blancs ? Est-ce la fonction "BLOCK" qui gère ça ? Si oui je ne vois absolument pas comment enlever ce cadre afin de n'avoir que le document image inséré...

Ex : <img style="DISPLAY: block; FLOAT: left; MARGIN: 0px 10px 5px 0px" alt="" src="URL" align="left" />

Y a-t-il un moyen de tantôt laisser ces cadres et tantôt les enlever au sein du MEME BILLET en utilisant simplement l'édition HTML du billet ?

2) Les images réactives ("Mouse Over"). Personnellement, ça m'intéresserait pour des accès rubriques-catégories (par le biais des fameuses vignettes-liens ^_°).

Beaucoup de générateurs communiquent des scripts décomposés en deux parties : l'un à saisir entre les balises HEAD et l'autre entre les balises BODY mais sur "Blogger", je ne vois pas où placer ces codes précisément et je vois encore moins lorsqu'on souhaite faire ça pour 15 à 20 cas différents (15 à 20 accès rubriques).

Les scripts en questions sont les suivants (ou du moins souvent de ce type) :

<!-- STEP ONE: Insert this code into the HEAD section of your HTML document -->

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
loadImage1 = new Image();
loadImage1.src = "URL photo correspondant au rendu souhaite lorsque la souris passe dessus";
staticImage1 = new Image();
staticImage1.src = "URL photo correspondant au rendu souhaite lorsque la souris n'est pas encore au-dessus";

// End -->
</script>

<!-- STEP TWO: Insert this code into the BODY of your HTML document -->

<span onmouseover="image1.src=loadImage1.src;" onmouseout="image1.src=staticImage1.src;">
<img name="image1" src="URL photo correspondant au rendu souhaite lorsque la souris n'est pas encore au-dessus" border=0></span>

Voilà... Comme "dit" à LDL, si tu quelqu'un pouvais m'aider, je lui en serait fort reconnaissant (^_^) !

Merci pour votre attention & bon week end.

Fury-161.

• participer

Message publié le samedi 17 mai 2008 à 15 h 46 par Fury161.

Re' ! ; )

Pour la question au sujet les "Mouse Over", c'est Ok à mon esprit grâce à Dr_von_scott (http://www.allhtml.com/forums/posts_list/topic:506516) ayant donné la réponse à Xerthro permettant par la même occasion de ne plus passer par le Javascript mais bel et bien en restant en HTML.

En revanche, la question des cadres photos et l'agencement(*) délicat (du moins à mes yeux) de ces dernières reste ouverte.

(*) J'entends par là que si j'y arrive aisément ailleurs, je n'arrive pas à coller deux images l'une à côté de l'autre sur "Blogger" / "Blogspot" en raison donc de ces cadres mais également en raison d'un espace semblant automatique. Je me doute bien qu'il n'y a rien de réellement automatique mais j'avoue tout simplement pas comprendre "le truc"...

Encore merci à Dr_von_scott !

Bon week end à tous.

Fury-161.

• participer

Message publié le samedi 17 mai 2008 à 16 h 45 par georgebaroud.

hello,

tu peux montrer un site sous blogger avec les dit cadres?

• participer

Message publié le samedi 17 mai 2008 à 18 h 03 par Fury161.

Hello ; )

Bien sûr, je te donne l'exemple du Blog que je suis en train de mettre sur pied pour l'assoc' dont je "parlais" dans l'autre post : http://spectre-events.blogspot.com et tu verras que sur celui-ci ou sur d'autre Blogs hébergés sur la même plateforme, par défaut (hormis les images dans la colonne de menus et les images rattachées à des éléments externes comme les slideshows, dioramas, etc..), 4 pixels sont automatiquement rajoutés aux 4 côtés des photos insérées. Pour le moment, je fais avec et me dém*rde avec mais je souhaiterais bel et bien connaître le moyen de faire sans (^_^)...

Voici un autre exemple d'un autre Blog, totalement pris au hasard sur "Blogger" / "Blogspot" : toujours le même cas.

T'aurais une idées du "truc" ? : )

Ce que je recherche doc surtout, c'est un moyen permettant de tantôt enlever ce cadre et tantôt le laisser au sein d'une même page (d'un même billet).

Merci en tout cas pour ta réaction ; )

Fury-161.

• participer

Message publié le samedi 17 mai 2008 à 18 h 06 par Fury161.

Re' ; )

J'ai oublié de joindre le lien (°_°). Le voici : http://quelquesbulles.blogspot.com et au haut de cet autre Blog-exemple tiré au hasard, tu peux en voir d'autre en cliquant sur "Blog suivant"... Les cas sont, tu verras, très nombreux.

Fury-161.

• participer

Message publié le samedi 17 mai 2008 à 19 h 42 par georgebaroud.

dans la feuille de style de ta page, c'est a cet endroit que sont défini les cadres et marge autour des images

.post img { margin-top:0; margin-right:0; margin-bottom:5px; margin-left:0; padding:4px; border:1px solid #000000; }

margin sont les marges externes au images
padding les marges internes (donc à l'interieur de la bordure)
et border la bordure

pour enlever les bordures, tu peux soit dans la balise de ton img : <img> modifier l'attribut style en ajoutant par exemple : border : 0px

pour le premier site que tu m'a donné, ça ferait
<img style="border : 0px;DISPLAY: block; FLOAT: left; MARGIN: 0px 10px 5px 0px" alt="" src="http://i114.photobucket.com/albums/n249/Fury-161/Les_Films_du_Spectre/Affiche_Don_t_look_now_Ok.jpg" align="left" />

soit créer une class dans les style de la page :

.pas_bordure{
border : 0px;
}

et dans le html

<img class="pas_bordure" style="border : 0px;DISPLAY: block; FLOAT: left; MARGIN: 0px 10px 5px 0px" alt="" src="http://i114.photobucket.com/albums/n249/Fury-161/Les_Films_du_Spectre/Affiche_Don_t_look_now_Ok.jpg" align="left" />

• participer

Message publié le samedi 17 mai 2008 à 20 h 32 par Fury161.

Re' ; )

Génial ! Merci, georgebaroud !

J'avais complètement oublié ces notions basiques de "PADDING" (°_°) ! Pourquoi chercher compliqué quand on peut faire simple : ça me poursuit manifestement (^_^).

En effet, dans mon cas, ce sont les facteurs de "BORDER" & de "PADDING" sur lesquels j'aurais dû me pencher. Ce qui donne à présent :

<img class="pas_bordure" style="border : 0px;DISPLAY: block; FLOAT: left; PADDING: 0px; MARGIN: __px __px __px __px" alt="" src="URL" align="left" /> et le tout est effectivement saisissable en ne passant que par l'édition HTML du billet et, donc, sans passer parle CSS général du Blog. Pile-poil ce que je recherchais.

Il ne me reste plus qu'à tenter de coller deux éléments image côte à côte et surtout tenter de coller un élément externe (genre Flash - slideshow ; player son ; player video) côte à côte avec une photo mais là, faut que je me redéconnecte. Je tente ça demain et je te tiens au courant. Ca devrait marcher grâce à ton aide !

Un grand merci pour ce bon coup de pouce !

Bonne soirée & sans doute @ demain (^_°).

Fury-161.

• participer

Message publié le jeudi 22 mai 2008 à 21 h 47 par Fury161.

Salut georgebaroud !

J'ai enfin pu faire plusieurs essais et effectivement : ça marche (^_°). Encore un grand merci d'avoir consacré du temps à mon interrogation.

@ bientôt !

Fury-161.

• participer

Message publié le jeudi 22 mai 2008 à 21 h 53 par Fury161.

...

J'oublais de cocher la case relative au problème résolu (^_°).

@ + tout le monde.

Fury-161.

• participer

liste des forums liste des discussions Participer à la discussion

Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.