Sửa hover trong Css sang dạng Nhấp chuột

[Cáo Già Đeo Nơ]

Code:

.bangthongtin {
position: fixed;
background: url(http://s1132.photobucket.com/albums/m580/saothaibinh72/css/tttv10.png) center left no-repeat;
width:170px;
background-color: #fddeff;
padding:5px 5px 5px 30px;
border:1px solid #8A8A8A;
border-radius:10px 0 0 10px;
right:-180px;
top:70px;
transition: all 3s ease; -webkit-transition: all 3s ease; -moz-transition: all 3s ease;
}
bangthongtin:hover {
right:-1px;
transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease;
}

Hiện tại mình đang dùng code trên để làm bảng thông tin ẩn hiện, cái này giống với bộ gõ, khi chỉ chuột vào nó sẽ hiện ra phần khai báo ở hover, nhưng giờ mình muốn khi Nhấp chuột vào nó mới hiện thì mình cần viết css như thế nào?

Demo là cái bảng lí lịch thành viên của luôn, ai giúp mình cách viết code css để khi nhấp vào nó mới hiện ra như nhé, mình xin cám ơn.

[Cáo Già Đeo Nơ]

Sr Up cho nó cái, gần 1/2 ngày rồi

[Zero]

bất khả thi vì css ko có chắc năng nào giống vậy

[Sấm]

khi chỉ chuột vào nó sẽ hiện ra phần khai báo ở hover, nhưng giờ mình muốn khi Nhấp chuột vào nó mới hiện

chả là như nhau rồi à

[Sấm]

À có thêm món mới đấy, ẩn cái thông tin của bạn đi sau khi người dùng bấm vào thì sẽ hiện . Vậy là ok chứ nhỉ

[Cáo Già Đeo Nơ]

Sao lại như sau , mình bỏ bên phải nên nhiều khi kéo thành trượt nên đụng vô là nó lòi ra, còn bấm vô nó khác chứ

[handsomevip007]

Cái lý lịch thành viên không phải CSS =.=!! Nó là Script =.=!!

[Cáo Già Đeo Nơ]

Vậy cho tôi xin đoạn script đó được không? tôi đang dùng cách css nên hơi bất tiện.

[Sấm]

Có nhều loại

Code:

<div style="margin:20px; margin-top:5px"><div
style="font:
12px Verdana, Geneva, Lucida, 'Lucida Grande';
margin-bottom:2px"><b></b>
 <input type="button"
value="Hiển thị"
style="width:180px;font-size:14px;margin:0px;padding:0px;"
 onclick="if
(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
!=
 '') {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
=
 '';        this.innerText = ''; this.value = 'Ẩn đi'; } else {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
=
 'none'; this.innerText = ''; this.value = 'Hiển thị lại'; }"
/></div><div
 style="min-height: 0px; max-width: 200px;
background-color:
transparent; margin: 0px; padding: 0px; border: 0px
inset;"><div
 style="display: none;">NỘI DUNG MUỐN ẨN</div></div></div>


Trong view_topic_body tìm đoạn này

Code:

 <!-- BEGIN profile_field -->
                    {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->

Bao nó bằng 1 thẻ span hay div hay gì đó , như của bạn là vậy:

Code:

 <!-- BEGIN profile_field -->
                  <span="bangthongtin"> {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}</span>
            <!-- END profile_field -->

Publish và xem

[Cáo Già Đeo Nơ]

Tks bác nhé

[Cáo Già Đeo Nơ]

Bác Sấm bị nhầm hàng rồi, cái mình nói là cái bảng Lý lịch thành viên giống Cp ấy, còn cái bác đưa là cái thông tin ở dưới avata mà.

[IceFox]

Code:

.bangthongtin {
position: fixed;
background: url(http://s1132.photobucket.com/albums/m580/saothaibinh72/css/tttv10.png) center left no-repeat;
width:170px;
background-color: #fddeff;
padding:5px 5px 5px 30px;
border:1px solid #8A8A8A;
border-radius:10px 0 0 10px;
right:-180px;
top:70px;
transition: all 3s ease; -webkit-transition: all 3s ease; -moz-transition: all 3s ease;
}
bangthongtin:hover {
right:-1px;
transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease;
}

Hiện tại mình đang dùng code trên để làm bảng thông tin ẩn hiện, cái này giống với bộ gõ, khi chỉ chuột vào nó sẽ hiện ra phần khai báo ở hover, nhưng giờ mình muốn khi Nhấp chuột vào nó mới hiện thì mình cần viết css như thế nào?

Demo là cái bảng lí lịch thành viên của luôn, ai giúp mình cách viết code css để khi nhấp vào nó mới hiện ra như nhé, mình xin cám ơn.

Dung code bảng lý lịch luôn đi. Còn qua css cho phức tạp thêm

[Cáo Già Đeo Nơ]

Dùng css chủ yếu là làm bảng ẩn hiện thôi, tại k biết làm giống .

[quangtrung_it]

Dùng css dễ chỉnh sửa các thuộc tính của code hơn script nhiều đó.

[Cáo Già Đeo Nơ]

hic xoay đi xoay lại là vẫn chưa biết cách làm sao thay vì chỉ chuột nó hiện ra bằng bấm nó mới hiện ra.

[Sấm]

ặc ặc Làm giống cái đó à !@@ vậy bạn làm 1 cái như đi rồi đặt class làm tương tự thôi

[Cáo Già Đeo Nơ]

Bạn Sấm biết làm cái giống không?
Nếu biết có thể chỉnh mình toàn tập cách làm được không?

[Sponsored content]