effet page corné mais soucis avec mon css ?

flaydeerflaydeer Member
décembre 2009 modifié dans Entraide
Bonjour,

j'ai inserer un effet page corné en jQuery mais apparament un petit soucis avec mon css, je m'explique: on vois un bout de l'image arrière sur la partie inférieur.
Après 2 ou 3 passages de souris le bugue disparait !

Si quelqu'un à la soluce ?

Ps: je vous donne la procédure bientot !

Voici l'adresse: http://blog-cs-creatives.at/

Merci


<!-- Script Effet page cornée -->
<script type="text/javascript">

$(function() {
$('#corner img').hover(function() {
$(this).stop().animate({ width:'200px', height:'200px' });
}, function() {
$(this).stop().animate({ width:'80px', height:'80px' });
});
});
</script>

CSS:


#corner {
background:url(imag/illustration.png) top right;
position:absolute;
top:0px; right:0px;
z-index:9999;
margin: 0 ;
padding: 0;
}

#corner img {
border:0;
width:80px; height:80px;
-ms-interpolation-mode:bicubic;

}

Réponses

  • oscimoscim Member
    décembre 2009 modifié
    Salut

    Un petit height sur le #corner

    soit 
    #corner {
height:78px;
...
}
    Et sous FF3 , plus de soucis..

    Mais ensuite ca bloque l'agrandissement de l'image lors du survol.

    En fait, Il y as un petit confl entre l'apercu de l'image et les element du a#corner

    Mais en rajoutant un #corner:hover, avec la valeur à 200px ca passe.

    Reste a voir sous d'autre cieux que FF
  • StéphaneStéphane Member, Former PluXml Project Manager
    Je me permet de compléter la procédure d'installation

    dans le fichier header.php du thème

    1. Au dessus de
    </head>
    ajouter
    <script type="text/javascript" src="<?php $plxShow->template(); ?>/js/jquery.js"></script>
    (copier la librairie jquery (fichier jquery.js) dans un dossier js à créer dans le répertoire de votre thème

    2. En dessous de
    <body>
    copier les lignes suivantes
    <div> 
	<a id="corner" href="<?php $plxShow->racine() ?>"><img src="<?php $plxShow->template(); ?>/img/corner.png"/></a>  
</div>
    (le fichier corner.png est à copier dans le dossier img de votre theme)

    Consultant PluXml

    Ancien responsable et développeur de PluXml (2010 à 2018)

Connectez-vous ou Inscrivez-vous pour répondre.