codage java pour survole bouton

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu codage java pour survole bouton

Message par eternalis le Lun 6 Fév 2012 - 18:46

Sad Bonjour a tous,

Voila mon souci est le suivant j'ai installer une boite latéral pour y mettre quelques lein au forum j'y est donc intégré des images en guise de lien mais j'aimerais savoir comment faire pour que c'est dernier change de couleur suite au survole par le curseur de la sourie car aprés mainte essais je ne trouve pas le ou les codes nécessaire pour le faire sans provoquer de défaut..

Le lien du forum est http://testautrement.forumgratuit.org/

Je suis en phpbb2

Mon java est le suivant:

Spoiler:
jQuery(document).ready(function() { jQuery('body').append('<table cellspacing="0" cellpadding="0" style="position: absolute; top: 20px; left: 0px; z-index:10000;"><tr><td><div id="panneau" scrolling="no" style=" box-shadow: 1px 1px 4px #555; border-radius: 0 10px 10px 0; background-color: #800073; width: 200px; height: 270px; display: none;" marginwidth="0" marginheight="0" frameborder="0">


<center><img src="https://i40.servimg.com/u/f40/17/00/76/39/profil10.png" alt="Image" border="0" /></a><br>

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=informations"><img src="https://i40.servimg.com/u/f40/17/00/76/39/inform11.png" alt="Image" border="0"/></a><br>

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=preferences"><img src="https://i40.servimg.com/u/f40/17/00/76/39/prefer10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=signature"><img src="https://i40.servimg.com/u/f40/17/00/76/39/fichie10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=avatars"><img src="https://i40.servimg.com/u/f40/17/00/76/39/avatar10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=friendsfoes"><img src="https://i40.servimg.com/u/f40/17/00/76/39/amis_i10.png" alt="Image" border="0" /></a>


<a href="http://recifalautrement.forumpaca.net/search?search_id=watchsearchl"><img src="https://i40.servimg.com/u/f40/17/00/76/39/sujet_10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/search?search_id=favouritesearch"><img src="https://i40.servimg.com/u/f40/17/00/76/39/favori10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/search?search_id=draftsearch"><img src="https://i40.servimg.com/u/f40/17/00/76/39/brouil10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/rpg_sheet_edit?u=1"><img src="https://i40.servimg.com/u/f40/17/00/76/39/paloud10.png" alt="Image" border="0" /></a>

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=facebook"><img src="https://i40.servimg.com/u/f40/17/00/76/39/facebo10.png" alt="Image" border="0" /></a>


</center>
</div></td><td style="vertical-align: middle;"><img src="https://i40.servimg.com/u/f40/17/00/76/39/source11.png" onClick="document.getElementById(\'panneau\').style.display=(this.src==\'https://i40.servimg.com/u/f40/17/00/76/39/source11.png\')?\'block\':\'none\';this.src=(this.src==\'https://i40.servimg.com/u/f40/17/00/76/39/source11.png\')?\'https://i40.servimg.com/u/f40/17/00/76/39/clooo10.png\':\'https://i40.servimg.com/u/f40/17/00/76/39/source11.png\';"/></td></tr></table>'); } );

Mon css est modifiez:

le voici:

Spoiler:
/* avatar oblique debut ****************************************************************************************************************************

.postdetails.poster-profile a img {

/* mozilla *
-moz-transform:rotate(-5deg);

/* Chrome *
-webkit-transform:rotate(-5deg);

/* Opera *
-o-transform:rotate(-5deg);

/* Internet Explorer *
-ms-transform:rotate(-5deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1.5);
}
/* avatar oblique fin *****************************************************************************************************************************/


/* slideshow accordeon debut **********************************************************************************************************************/
#accueil
{
width: 900px;
height: 400px;
overflow: hidden;
background: url(http://img11.hostingpics.net/pics/181185imagedefond.jpg) center no-repeat;
border: 3px solid #272727;
}
#page1
{
width: 40px;
height: 400px;
float: left;
overflow: hidden;
background-color: #555555;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page1:hover
{
width: 80%;
height: 400px;
overflow: hidden;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page2
{
width: 40px;
height: 400px;
float: left;
overflow: hidden;
background-color: #777777;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page2:hover
{
width: 80%;
height: 400px;
overflow: hidden;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page3
{
width: 40px;
height: 400px;
float: left;
overflow: hidden;
background-color: #9b9b9b;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page3:hover
{
width: 80%;
height: 400px;
overflow: hidden;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page4
{
width: 40px;
height: 400px;
float: left;
overflow: hidden;
background-color: #bababa;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page4:hover
{
width: 80%;
height: 400px;
overflow: hidden;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page5
{
width: 40px;
height: 400px;
float: left;
overflow: hidden;
background-color: #dcdcdc;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#page5:hover
{
width: 80%;
height: 400px;
overflow: hidden;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}

.contenu_page
{
width: 100%;
height: 400px;
}
.page_titre
{
display: inline-block;
height: 40px;
width: 400px;
color: #ffffff;
margin-left: -180px;
text-align: center;
font-size: 24px;
font-family: arial black;
letter-spacing: 2px;
text-shadow: 1px 1px 0px #5f5f5f;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
}
.contenu
{
width: 0px;
height: 0px;
background-color: white;
overflow: hidden;
padding: 6px;
opacity: 0;
-moz-opacity: 0;
-khtml-opacity: 0;
filter: alpha(opacity=0);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
#page1:hover .contenu, #page2:hover .contenu, #page3:hover .contenu, #page4:hover .contenu, #page5:hover .contenu
{
width: 650px;
height: 380px;
margin-left: -180px;
background-color: white;
overflow: none;
opacity: 1;
-moz-opacity: 1;
-khtml-opacity: 1;
filter: alpha(opacity=100);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}

.credit
{
display: block;
text-align: right;
margin-right: 20px;
}
.credit a
{
font-size: 10px;
text-decoration: none !important;
}
/*slideshow accordeon fin ************************************************************************************************************************/

/* placement des sous forum dans les categories debut**********************************************************************************************/
.genmed a,.genmed a:active{
font-size:0.8em;
text-decoration:none;
}
.genmed a:hover{
text-decoration:underline;
}
/* placement des sous forum dans les categories fin************************************************************************************************/
/* centrage de la feuille de fond d'ecran forum debut**********************************************************************************************/


body{
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}
/* centrage de la feuille de fond d'ecran forum fin************************************************************************************************/
/* tourne l'avatar debut***************************************************************************************************************************/
.postdetails.poster-profile a img {

/* mozilla */
-moz-transform:rotate(-5deg);

/* Chrome */
-webkit-transform:rotate(-5deg);

/* Opera */
-o-transform:rotate(-5deg);

/* Internet Explorer */
-ms-transform:rotate(-5deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1.5);
}
/* tourne l'avatar fin*****************************************************************************************************************************/


/* ombre sous les speudo debut********************************************************************************************************************/
.name div span {
text-shadow: #000000 1px 1px 1px;
}
/* ombre sous les pseudo fin **********************************************************************************************************************/
/* contour et agrandissement citation debut********************************************************************************************************/
.quote {
font-size : 20px;
border : 1px solid #ff00ff;
}
/* contour et agrandissement citation fin**********************************************************************************************************/

Merci de votre participation et de vos propositions a venir

Aurélie


eternalis
***

Messages : 117
Inscrit(e) le : 15/03/2009

http://recifalautrement.forumpaca.net
eternalis a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: codage java pour survole bouton

Message par Automne le Lun 6 Fév 2012 - 22:13

Bonjour,

J'ai repris votre premier lien
Code:

<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=informations"><img src="http://i40.servimg.com/u/f40/17/00/76/39/inform11.png" alt="Image" border="0"/></a><br>

I faut lui rajouter ceci
Code:
style="opacity:0.7;filter:alpha(opacity=70)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=70"

se qui donne
Code:
<a href="http://recifalautrement.forumpaca.net/profile?mode=editprofile&page_profil=informations"><img src="http://i40.servimg.com/u/f40/17/00/76/39/inform11.png" alt="Image" border="0" style="opacity:0.7;filter:alpha(opacity=70)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=70"/></a><br>

Automne
+ Hyperactif +

Messages : 8423
Inscrit(e) le : 22/03/2010

http://gilles570.forumactif.info/
Automne a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: codage java pour survole bouton

Message par eternalis le Lun 6 Fév 2012 - 22:20

Merci Automne ceci me convient parfaitement,

Je vous remercie car je n'ai plus de cerveau depuis hier a me le torturer hihihihi faut que je fasse des poses lol

En tout cas génial et merci pour vos compétence et votre dévouement.

Bien a vous.

Aurèlie

eternalis
***

Messages : 117
Inscrit(e) le : 15/03/2009

http://recifalautrement.forumpaca.net
eternalis a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum