Overblog Suivre ce blog
Administration Créer mon blog
11 septembre 2009 5 11 /09 /septembre /2009 06:00

Cet article a été transféré sur les Nouvelles Ficelles d'Anna K

Repost 0
Published by AnnaK - dans Archives
commenter cet article
1 septembre 2009 2 01 /09 /septembre /2009 06:27

Cet article a été transféré sur les Nouvelles Ficelles d'Anna K

Repost 0
Published by Anna K - dans Archives
commenter cet article
28 août 2009 5 28 /08 /août /2009 00:55

En règle générale, s'il y a un ascenseur, c'est que le contenu du module est plus large que le contenant. 

Mais, il peut arriver que le contenant soit entièrement visible et pourtant un tout petit ascenseur s'est créé, très inesthétique. On peut donc le supprimer.

Ainsi, j'avais un ascenseur horizontal dans le module Pub, que l'on ne voyait que sous FF.

Ce module était placé dans la colonne de gauche. J'ai donc rajouté la ligne suivante dans le CSS global :

#ln_1 #cl_1_0 .box-content {overflow:hidden;}


Pour la colonne de droite :

#ln_1 #cl_1_2 .box-content {overflow:hidden;}
Repost 0
Published by Anna K - dans Archives
commenter cet article
27 juillet 2009 1 27 /07 /juillet /2009 00:40

Vous copiez ce code. Vous le personnalisez en mettant l'adresse de votre propre image (en rouge) et le lien de destination en vert.
J'ai pris la 1ère image qui me tombait sous la main, mais il peut être sympa d'en créer une avec écrit la destination.
Dans ce cas précis, l'image amène vers la déco d'Annak. en cliquant dessus.
Vous collez ensuite ce code dans l'article de la page où vous voulez voir apparaître cette image-lien

<body onload="chargement(null)"><a href='#' onclick='redirigerObjet(); return false;' id='objetLien'><img src=' http://idata.over-blog.com/0/37/17/67/articles/oeuf1.jpg id='objetImage' style='position: absolute; z-index: 10;'/></a> '

  <script type='text/javascript'>

   var x1 = xObjet();
   var y1 = yObjet();

   var x2;
   var y2;

   createXObjet();
   createYObjet();

   var direction = (y2 - y1) / (x2 - x1);
   var ordonnee = y1 - direction * x1;

   var xc = x1;
   var yc = y1;

   var vitesse = 4.5;

   function xObjet() {
    return Math.floor(Math.random() * (screen.width - 250));
   }

   function yObjet() {
    return Math.floor(Math.random() * (screen.height - 250));
   }

   function createXObjet() {

    do {
     x2 = xObjet();
    } while(Math.abs(x2 - x1) < 50);

   }

   function createYObjet() {

    do {
     y2 = yObjet();
    } while(Math.abs(y2 - y1) < 50);

   }

   function redirigerObjet() {

    var objet = document.getElementById('objetLien');

    if(objet.display != 'none') {
     objet.display = 'none';
     document.location.href = 'http://decoannak.over-blog.fr';    }

   }

   function deplacerObjet() {

    if(xc == x2 && yc == y2) {

     x1 = x2;
     y1 = y2;

     createXObjet();
     createYObjet();

     direction = (y2 - y1) / (x2 - x1);
     ordonnee = y1 - direction * x1;

     xc = x1;
     yc = y1;

    }

    if(x2 > x1) {

     xc += vitesse;

     if(xc > x2) {
      xc = x2;
     }

    } else {

     xc -= vitesse;

     if(xc < x2) {
      xc = x2;
     }

    }

    yc = Math.round(ordonnee + direction * xc);

    var objet = document.getElementById('objetImage');

    objet.style.left = xc + 'px';
    objet.style.top = yc + 'px';

   }

   setInterval('deplacerObjet()', 10);

  </script>

  MàJ : Janvier 2009

Repost 0
Published by Anna K - dans Archives
commenter cet article
1 juin 2009 1 01 /06 /juin /2009 00:33

cet article a été transféré sur les nouvelles ficelles d'Anna K

Repost 0
Published by Anna K - dans Archives
commenter cet article
25 avril 2009 6 25 /04 /avril /2009 02:11

Une boîte à message est, en fait, un chat de grandes dimensions.

Sur Chatango.com, il suffit de vous inscrire ("sign up"), c'est gratuit.

Une fois votre compte créé, cliquez sur "Add a new chat group on your web page". 

Etape 1 : Vous devez nommer votre boîte à messages puis lui donner une URL (adresse), qui sera automatiquement suivi de ".chatango.com". Le tableau en dessous vous permet de définir l'aspect de la fenêtre dans laquelle il apparaîtra sur votre blog. Vous choisissez d'abord sa taille, la taille de la police, puis les couleurs (à chaque modification, la fenêtre à droite vous donne en temps réel l'aspect qu'aura votre fenêtre).

Etape 2 : copiez le code fourni et coller le dans le mode source/HTML, là où vous voulez que soit affiché votre boîte.

Exemple de code :

<div><embed src="http://unessai.chatango.com/group" bgcolor="#FFFFFF" width="250" height="360" wmode="transparent" type="application/x-shockwave-flash" ></embed><br>[&nbsp;<a href="http://unessai.chatango.com/clonegroup">Steal this</a>&nbsp;|&nbsp;<a href="http://chatango.com/creategroup">New Group</a>&nbsp;|&nbsp;<a href="http://unessai.chatango.com">Full Size</a>&nbsp;]</div>

Important : dans le dernier cadre, l'adresse URL de votre forum vous est redonnée. Notez la bien pour pouvoir la fournir en lien à vos amis.

Un exemple :

Repost 0
Published by Anna K - dans Archives
commenter cet article
21 avril 2009 2 21 /04 /avril /2009 11:24

Dans le CSS, vous rajoutez toute la ligne


.diablog .title {background-image:URL(http://fdata.over-blog.com/0/37/17/67/thumbs/les-oeufs-faberge/oeuf3.png);background-repeat:no-repeat;background-position:left;padding-top:55px; text-align:center;}


padding-top:55px; est la marge du haut que l'on a donc augmenté pour placer l'image. Jouez avec le nombre de px.  

 

Mise à Jour : Avril 2009
Repost 0
Published by Anna K - dans Archives
commenter cet article
14 mars 2009 6 14 /03 /mars /2009 08:51

Cet article a été transféré sur les Nouvelles Ficelles d'Anna K

Repost 0
Published by AnnaK - dans Archives
commenter cet article
12 février 2009 4 12 /02 /février /2009 00:23

Si vous désirez  que chacune de ces 2 parties ait un design particulier




Vous rajoutez dans le CSS la ligne

.recherche input { }


Elle concerne les 2 rectangles.
Mais vous allez y faire les modifications du 1er rectangle - celui de saisie - en rajoutant la couleur d'écriture, de fond, la longueur, la largeur...

Pour le design du 2nd rectangle - celui où il y a écrit Recherche - vous allez rajouter dans le CSS la ligne

.recherche .button {}

 



Dans mon exemple :

Pour le 1er rectangle, j'ai

  • mis un fond particulier
  • mis une bordure
  • fixé sa largeur à 200px
  • mis une couleur de saisie
.recherche input{ background-color:#3c4157;border:1px solid #000033;width:200px;color:#d8e2ec;}


Ces modifications sont apparus sur les 2 rectangles, j'ai alors décidé, pour le 2nd rectangle, de

  • mettre la largeur à 70px
  • un autre fond
  • une autre couleur d'écriture
  • de centrer le mot Recherche
.recherche .button {width:70px;background-color:#d8e2ec;color:#3c4157;text-align:center;}






Repost 0
Published by Anna K - dans Archives
commenter cet article
3 février 2009 2 03 /02 /février /2009 00:40
Repost 0
Published by Anna K - dans Archives
commenter cet article