LES WEB-EXCES

2009-09-20T15:29:00.000-07:00

Une animation Flash dans un message

Il faut tout d'abord héberger le fichier swf. Blogger n'est pas un hébergeur.

J'utilise Google Sites

Le fichier *.swf doit être placé dans un File Cabinet.

Pour insérer l'animation Flash, j'utilise le Lecteur Flash de ce Gadget Google :

flash_container.xml

Pour utiliser ce gadget dans un message, il faut l'insérer dans un tag iframe. En suivant les conseils du Blog d'Aide pour Blogger, on obtient ce code (à saisir sans retour à la ligne) :

Ce code permet d'afficher cette animation swf (Google Clock) :

http://sites.google.com/site/annuairevin/files/GoogleClock.swf

Les dimensions et la couleur de fond du gadget peuvent être adaptées

Le résultat

Inserer une animation Flash http://sites.google.com/site/annuairevin/flash-reader

Plus d'informations

Trucs et astuces pour Google Sites

Les outils pour Webmasters

2009-08-31T02:37:00.000-07:00

Le blog Tocqués2cuisine.com

Un air de fête dans l'assiette avec ces aumonières au thon. Une recette facile et pas chère.

...
Les ingrédients pour 4 personnes.

Pour les aumônières.
- 8 feuilles de brick
- 300 gr de thon au naturel
- 4 œufs
- 4 petites cebettes
- 2 cuillères à soupe de câpres
- 8 olives noires
- 25 gr de beurre
- 10 gouttes de Tabasco
- sel, poivre
- piques en bois

Pour la salade d’endives au miel.
- 6 endives
- 1 tomate
- 8 olives noires
- 1/2 cuillère à soupe de miel
- 1 cuillère à soupe de vinaigre balsamique
- 6 cuillères à soupe d’huile d’olive
- 1 cuillère à soupe de persil surgelé
- sel, poivre
Temps de préparation : 20 mn. Temps de cuisson : 15 mn.

La recette.

Pour cette recette si les cebettes sont de la taille d’un doigt, mettez en que 2. Si vous n’en trouvez pas, vous pouvez remplacer par 1/2 oignon.

Allumez le four thermostat 7 (220°).

- Ôtez la barbe et la première feuille des cebettes, rincez les à l’eau froide, coupez les en très fines rondelles.

- Mettez les dans un saladier, ajoutez le thon émietté après l’avoir égoutté.

- Ajoutez les câpres, sel, poivre et le Tabasco. Mélangez.

- Dénoyautez les olives noires, coupez les en rondelles, mettez les dans le saladier, mélangez.

- Faites fondre le beurre 30 secondes au micro onde.

- Mettez 2 feuilles de brick dans une grande assiette, badigeonnez les de beurre à l’aide d’un pinceau.

- Déposez deux cuillères de farce au thon au centre, puis un œuf.

- Repliez les feuilles de brick en les tenant par les bords, faites tenir avec 3 petites piques en bois plantées de part en part. Mettez l’aumônière sur une plaque à four. Procédez de la même manière avec les trois autres.

- Enfournez pour 15 mn environ. A surveiller car les aumônières sont cuites dès que la corolle à pris une jolie couleur dorée.

- Pendant ce temps, préparez la vinaigrette avec miel, vinaigre, sel, poivre et huile d’olive.

- Ôtez les premières feuilles des endives, ne les lavez pas, coupez les en tronçons et mettez les dans les assiettes avec des quartiers de tomates. Arrosez de vinaigrette au miel, parsemez de persil, terminez la décoration avec les olives noires.

Dès que les aumônières au thon sont dorées à point, déposez les dans les assiettes et servez bien chaud.

toques2cuisine - le blog gourmand de Chantal

2008-07-14T05:15:00.000-07:00

Inserting a *.pdf document into a post (for IE, Firefox ask to load the document)

Trucs et astuces pour Blogger - inserer un document pdf

2008-06-26T15:13:00.000-07:00

Ouvrir Une fenêtre popup

Appel de window.open dans un javascript

Ouverture d'un popup

2008-05-21T13:15:00.000-07:00

Henri de Villamont : Grands Vins de Bourgogne

L'article du Blog Les Découvertes des liens du Vin.

Bonne lecture ...

2008-05-21T09:07:00.000-07:00

test couleur

test bullet

item 1

item 2

item 3

2008-04-11T09:24:00.000-07:00

Un essais d'affichage de photos

Une petite photo, illustation Chaplin et Google

Les répertoires s144, s200, s288, s320, s400, s800et s1600. Les répertoires sxxx-h indiquent une page html contenant l image.

Sous Picasa, la photo est disponible sous s144, s288, s400 et s800.

Le click sur l'image déclenche l'affichage dans le répertoire s1600-h : une page html avec la photo en grand format. s1600 donne la photo.

2008-04-08T09:36:00.000-07:00

TEST IFRAME

Un document partagé de Google Docs

GPC tips and tricks - Test for Google group

2008-03-22T13:24:00.001-07:00

Une Presentation de Google Docs

Integrer la presentation / Diaporama dans un blog.

Une présentation Power Point dans un Blog

Une deuxieme presentation, créée avec PowerPoint (Office 2003) et importée sous Google Docs.

Essais sous PowerPoint 2003

Un lien vers la présentation

L'adresse de la présentation :

http://docs.google.com/Presentation?id=ddbg6bwg_28dn48v4cp

Cette URL demande l'enregistrement de l'utilisateur. Pour supprimer cette demande :

http://docs.google.com/Present?docid=ddbg6bwg_28dn48v4cp&skipauth=true

Le lien vers la Présentation Google Docs

2008-03-06T13:24:00.000-08:00

Une Video de Photobucket

Utilisation du tag embed

Pour essais

NENDAZ - 2007 Sonneurs de cloches

Le Valais, ses paysages et son folklore : Nendaz Valais 2007 - Cor des Alpes

Les Vins du Valais, diaporama : Paysages et vins du Valais

2008-02-22T06:07:00.000-08:00

Diaporama (Slideshow) avec Google AJAX Feed API

Utiliser le flux media RSS pour créer son propre diaporama

Le résultat de cet essais, un article sur les Diaporamas (Slideshow) utilisant un flux media RSS. C'est une alternative aux Diaporama en Flash.

Plus d'explications ici : Comment intégrer un Diaporama dans le corps du message

Blog d'Aide pour Blogger

2008-02-17T12:27:00.000-08:00

Une feuille de style pour un seul post

Un style valable pour un seul message. Charge une style sheet de façon dynamique.

Pour ne pas alourdir le blog avec un style qui ne serait utilisé que par un seul post, il est possible de charger de façon dynamique une feuille de style externe :

A titre d'exemple, un slideshow en CSS, selon l'idée de Stu Nicholls, reprise pour Google Page Creator, et que j'ai adapté pour Blogger :

Une gallerie horizontale en CSS :

La feuille de style est disponible sur mon site les Liens du Vin

2008-02-08T06:51:00.000-08:00

Des fichiers Flash pour Blogger

Placer une animation Flash - Les montres Bell and Ross.

Voir le blog Passion des Avions

L'objet inséré avec AC_FL_RunContent (Montre Bell And Ross Blue) :

Le même avec <embed>

Un objet swf :

2008-01-30T13:26:00.000-08:00

Une LightBox pour Blogger

Un essais d utilisation de LightBox. La version 1 du script de Lokesh Dhakar.

Sur une idée originale de Lokesh Dhakar - Le projet LightBox

2007-12-18T12:52:00.000-08:00

Opacite et transparence

Un article sur les filtres pour le Blog d'Aide en français

Firefox et Internet Explorer (5.5 et au-delà) disposent d'un filtre qui peut s'appliquer sur une image ou un bloc de texte.

La théorie

L'opacité (opacity) est définie comme le complément à 100 du taux de transparence (!) du filtre. Ainsi une opacité de 95% ne filtre que 5% de couleur, alors qu'une opacité de 5% retient 95% des couleurs.
Sous Firefox, le paramètre opacity varie de 0 à 1, alors que sous Internet Explorer, on utilise un filtre alpha (opacity) variant de 0 à 100.

L'utilisation

L'opacité peut être utilisée pour un bloc div, un paragraphe, des titres, une table complète ou des cellules. Elle s'utilise généralement avec une image. Pour le cas d'une image, Internet Explorer impose de définir au moins l'une des dimensions (width ou height).

Utilisation dans un bloc div

Le bloc div sans filtre

Le bloc div opaque à 90 % - filtre de 10 %

Le bloc div opaque à 70 % - filtre de 30 %

Le bloc div opaque à 50 % - filtre de 50 %

Le bloc div opaque à 30 % - filtre de 70 %

Le bloc div opaque à 10 % - filtre de 90 %

Le style du bloc div

// le bloc div opaque à 70 se définit comme suit, la clause opacity pour FF et le filtre pour IE
.opaque70 {
opacity: .7;
color: white;
filter: alpha(opacity=70);
}

Un filtre sur une image

L'image initiale est affichée avec une opacité de 20 %, le filtre est supprimé en passant le curseur de la souris sur l'image.

Les Liens du Vin

Le code

// la fonction agit comme un flip-flop et passe d'une opacite de 20 % à 100 % (pas de filtre)
// document.all permet de tester le type de navigateur
//
function changevisibility(lowvis,highvis)
{
force=(highvis==0)? 1 : 0.2
if (document.all)
lowvis.filters.alpha.opacity=force*100
else
lowvis.style.opacity=force
}

Un filtre sur une image qui change continuellement

Pour Noël, une image dont l'opacité varie par incrément de 5 %

Les images des Liens du Vin

Le code

// setInterval permet l'appel toutes les 250 millisecondes de la fonction
// l increment d opacite est de 5 %
// document.all permet de tester le type de navigateur
//
op=0;
var op_plus = 1;
var op_moins = 0;
//
function f_opacity()
{
if (op < op_plus="0" op_moins="1"> 0.05 && op_moins)
op-=0.05
else
{
op_plus=1
op_moins=0
}
if (document.all)
document.getElementById("testop_change").style.filter="alpha(opacity=" + 100 * op +")";
else
document.getElementById("testop_change").style.opacity=op;
}
setInterval("f_opacity()",250);

2007-12-16T07:39:00.000-08:00

Ajouter une page ou une URL dans ses favoris

Ou mieux utiliser le bookmarking social

Enregistrer LES LIENS DU VIN
dans les favoris

Ou mieux utiliser le SOCIAL BOOKMARKING

2007-10-04T09:21:00.000-07:00

Insertion document - iframe et Google Docs

Inserting a Shared Document from Google Docs and SpreadSheet into a page :

Test for Google group - insertion document

2007-09-23T12:32:00.000-07:00

Essais de dewplayer - videos et MP3 sur son blog

Inserer un lecteur flash (pour videos et fichiers mp3). Supprimer le message :

Cliquer ici pour activer et utiliser ce contrôle

Carl Orff - Carmina Burana - O Fortuna

Supprimer le message Cliquer ici pour activer et utiliser ce contrôle

Certaines configurations de IE affichent le message sous forme de tool-tip Cliquer ici pour activer .... Pour éviter cela il faut appeler le player avec un petit javascript fourni par Adobe

Attention : Ecrire le script sur une seule ligne !!!

Essais video

Une video des Liens du Vin

2007-09-09T07:46:00.000-07:00

How to enlarge picture - Blogger

A small picture of Rolle :

Double-click to open a big picture !!, or click here

s1600-h est la version html de la photo de grande taille

2007-09-02T13:24:00.000-07:00

Une iframe dans un post

iframe - pub Château de Châtagneréaz

2007-08-27T13:27:00.000-07:00

test with gif pictures

Un gif animé. Appel de Un site au hasard

2007-07-18T07:28:00.001-07:00

un test apostrophe

l'image pointe vers un lien

2007-07-14T09:22:00.000-07:00

Lien sur une image

Link to the image in http://www.liens-du-vin.ch/_pic03

Links to jpg, subfolder s1600-h

Picture for Meg, in blog : megknits408.blogspot.com, in s1600-h subfolder, links to jpg. Click on the picture display the picture.

Same picture, but with s320 subfolder, links to jpg. Click on the picture, ask to save/display the jpg file.

2007-07-10T08:42:00.000-07:00

Essais texte avec retrait

Texte avec retrait. Test pour petite Cure. Lavaux, vigne en terrasses. Le vignoble de Lavaux en Suisse.

Paragraphe 2. Texte avec retrait. Test pour petite Cure. Lavaux, vigne en terrasses. Le vignoble de Lavaux en Suisse.

2007-06-16T14:00:00.000-07:00

Lien interne dans un flux

Ceci est un essai de lien interne. Le depart est ici.

Tous les vins de qualité de cette région exceptionnelle (Bordeaux) ont d’ailleurs une caractéristique commune : la fraîcheur. Celle qui donne envie de savourer un deuxième, voire un troisième verre, ou d’accompagner tout un repas.

Le Domaine du Mont d'Or produit les Grains Nobles. Ce sont les vins des raisins laissés sur souche jusqu'aux confins de l'arrière-automne, quelquefois jusqu'en décembre. Les grains sont alors atteints du fameux botrytis cinerea, la célèbre pourriture noble qui donne les plus grands vins blancs surmaturés du monde.

La région de Bordeaux.

2007-03-24T13:47:00.000-07:00

les étiquettes du vin

test

2005-08-31T13:45:00.000-07:00

Le sommaire du message. Essais avec Lire la suite.

Un essai de post avec le texte lire la suite ...

La suite du message. Voir le Groupe d'Aide Blogger en français pour plus d'explications.

Version anglaise ici

Expandanble Post Summaries.

Attention au texte du message, la fin du sommaire se marque par :

<span class="fullpost">la suite du message</span>