Cum Pot Face Ca Imaginile Userilor Să Se Rotească Pe Index ?

[Ronaldo @ Heker]

Salutare , cum spune şi titlu am această întrebare pentru voi.

 

Uitaţi pentru a înţelege mai bine ce doresc , o poză : http://imgur.com/zO7UkAK

 

Dacă s-a mai discutat , îmi cer scuze dar nu am găsit pe net niciunde..

             

                                                                                                                                     @Mulţumesc !

[+Awes#]

cauta in ipb_styles.css 

.ipsUserPhoto

o sa iti apara asta:

.ipsUserPhoto {
	-webkit-border-radius: 2px;
	border-radius: 2px;
}

tu o sa adaugi dupa primul rezultat asta:

a.userNavPhoto:hover,
	.ipsUserPhotoLink:hover .ipsUserPhoto { -moz-transition: all 0.5s ease-in-out;		-webkit-transition: all 0.5s ease-in-out;		-o-transition: all 0.5s ease-in-out;		-ms-transition: all 0.5s ease-in-out;		transition: all 0.5s ease-in-out;		-moz-transform: rotate(-360deg);		-webkit-transform: rotate(-360deg);		o-transform: rotate(-360deg);		-ms-transform: rotate(-360deg);		transform: rotate(-360deg);
		opacity: 0.8;
	}

[+Data]

Sau daca vrei decat iconitele alea mici sa se roteasca, cauti  .ipsUserPhoto_mini si  schimbi/adaugi:

  Reveal hidden contents

.ipsUserPhoto_mini { width: 34px; height: 34px; -webkit-transition-duration: 1s;

    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s; }
.ipsUserPhoto_mini:hover { width: 34px; height: 34px; -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg); }

 

Cum a zis Lexzfcp se aplica peste tot

[Ronaldo @ Heker]

Am adăugat şi acum arată aşa :

  Quote

 

.ipsUserPhoto {
    -webkit-border-radius: 2px;
    border-radius: 2px;
a.userNavPhoto:hover,
    .ipsUserPhotoLink:hover .ipsUserPhoto
         -moz-transition: all 0.5s ease-in-out;        
         -webkit-transition: all 0.5s ease-in-out;        
         -o-transition: all 0.5s ease-in-out;        
         -ms-transition: all 0.5s ease-in-out;        
         transition: all 0.5s ease-in-out;        
         -moz-transform: rotate(-360deg);        
         -webkit-transform: rotate(-360deg);        
         o-transform: rotate(-360deg);        
        -ms-transform: rotate(-360deg);        
        transform: rotate(-360deg);
        opacity: 0.8;
}
  

 

  On 4/7/2015 at 9:04 AM, Data said:

Sau daca vrei decat iconitele alea mici sa se roteasca, cauti  .ipsUserPhoto_mini si sub el mai schimbi/adaugi

  Reveal hidden contents

.ipsUserPhoto_mini { width: 34px; height: 34px; -webkit-transition-duration: 1s;

    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s; }
.ipsUserPhoto_mini:hover { width: 34px; height: 34px; -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg); }

 

Cum a zis Lexzfcp se aplica peste tot

am pus şi ce ai spus tu şi arată în temă aşa :

 

 

  Quote

 

.ipsUserPhoto_mini { width: 30px; height: 30px; }
.ipsUserPhoto_mini:hover { width: 34px; height: 34px; -moz-transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;-moz-transform: rotate(-360deg);-webkit-transform: rotate(-360deg);
o-transform: rotate(-360deg);-ms-transform: rotate(-360deg);
transform: rotate(-360deg); }

 

 

Şi nimic , nu se roteşte nimic

[+Data]

Pai vezi ca sunt puse de 2 ori si cred ca ai pus in codurile alea intre /* */ care nu fac nimic

  Reveal hidden contents

/* .ipsUserPhoto {
    padding: 1px;
    border: 1px solid #505050;
    background: #202020;
    -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.5);
    box-shadow: 0px 2px 2px rgba(0,0,0,0.5);
}
    
    .ipsUserPhotoLink:hover .ipsUserPhoto {
        border-color: #656565;
    }

    .ipsUserPhoto_variable { max-width: 155px; }
    .ipsUserPhoto_large { max-width: 90px; max-height: 90px; }
    .ipsUserPhoto_medium { width: 50px; height: 50px; }
    .ipsUserPhoto_mini { width: 30px; height: 30px; }
    .ipsUserPhoto_tiny { width: 20px; height: 20px;    }
    .ipsUserPhoto_icon { width: 16px; height: 16px;    } */

.ipsUserPhoto {
    -webkit-border-radius: 2px;
    border-radius: 2px;
}
    
    a.userNavPhoto:hover,
    .ipsUserPhotoLink:hover .ipsUserPhoto {
        opacity: 0.8;
    }

    .ipsUserPhoto_variable { max-width: 155px; }
    .ipsUserPhoto_large { max-width: 94px; max-height: 94px; }
    .ipsUserPhoto_medium { width: 54px; height: 54px; }
    .ipsUserPhoto_mini { width: 34px; height: 34px; -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s; }
.ipsUserPhoto_mini:hover { width: 34px; height: 34px; -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg); }
    .ipsUserPhoto_tiny { width: 24px; height: 24px;    }
    .ipsUserPhoto_icon { width: 20px; height: 20px;    }

  

Ti-am pus eu tot codu. Noroc !