Giúp: Làm hiện bảng thông tin dần dần từ trái sang phải trong 2 giây[✔]

[buc4rgame]

Mình có có một vấn đề cần giúp đó là 
Phần thông tin cá nhân ẩn hiện khi chỉ chuột vào đó nó hiện ra luôn, nhìn rất cộc, không được mượt mà, mình muốn khi ta chỉ chuột vào nó hiện ra dần dần và từ trái sang phải

Đây là forum của mình

Code:

http://tauthuy.fanbb.net/t1-topic

Còn đây là demo mẫu mà mình muốn làm giống như thế

Code:

http://doquangthiem.lifeme.net/t1-topic

Thấy bên này bạn đó dùng thuộc tính transition: width .2s;

Mà mình thêm vào thì k được, mong các bạn chỉ giáo 

[handsomevip007]

Dùng tạm cái này nhé Chèn vào cuối CSS

Code:

.userInfoF {
display: block!important;
max-width: 141px!important;
height: 130px;
overflow: hidden;
transition: width .2s;
-webkit-transition: width .2s;
opacity: 0!important;
}

.userInfoF[style="display: block;"] {
width: 510px!important;
opacity: 1!important;
}

[buc4rgame]

Không được bạn ơi, mới đầu nó còn thụt ra thụt vào chỉ có điều không mượt mà nhưng sau khi thêm đoạn css của bạn thế là nó ẩn đi luôn, bạn kiểm tra lại giúp mình với 

Đây là đoạn js mình dùng

Code:

function hide_user(hu) {
 $("#userinfo" + hu).find(".userInfoF").hide()
}

[handsomevip007]

À nhầm Bạn thử lại đoạn sau

Code:

.userInfoF {
display: block!important;
width: 141px!important;
height: 130px;
overflow: hidden;
transition: width .2s;
-webkit-transition: width .2s;
opacity: 0!important;
}

.userInfoF[style="display: block;"] {
width: 510px!important;
opacity: 1!important;
}

[buc4rgame]

Không được luôn, bỏ cái width: 141px!important; thì được nhưng lại như ban đầu, hiện ra vù một phát, mình gửi nick admin bạn làm thử nha

[Rubber]

Bạn có thể tham khảo thêm tại đây.

[Sponsored content]