Công cụ tìm kiếm nhanh trên thanh tiêu đề

PVS

Cộng Sự Đặc Biệt
Thành viên BQT
Tham gia
28/02/2015
Bài viết
15,210
Được Like
11,621
Vnxf.vn - Đặt code trong EXTRA.css:

Mã:
/* START - QuickSearch in Header */
#QuickSearch {
top: -103px;
background-color: transparent;
}

#QuickSearch.active {
background: #176093; /* Old browsers */
background: -moz-linear-gradient(top,  #176093 0%, #60abf8 39%, #ffffff 80%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#176093), color-stop(39%,#60abf8), color-stop(80%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #176093 0%,#60abf8 39%,#ffffff 80%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #176093 0%,#60abf8 39%,#ffffff 80%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #176093 0%,#60abf8 39%,#ffffff 80%); /* IE10+ */
background: linear-gradient(to bottom,  #176093 0%,#60abf8 39%,#ffffff 80%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#176093', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.formPopup {
    background-color: transparent;
}

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveMediumWidth)
{
    .Responsive #QuickSearch
    {
        top: -18px;
    }
}
</xen:if>
/* END - QuickSearch in Header */

Kết quả là:

qs_closed.PNG

... Và khi hoạt động:

qs_active.PNG

Có bấy nhiêu thôi.

Để phù hợp trên thanh tiêu đề của bạn chỉ cần điều chỉnh các số ở đây:
Mã:
top: -103px;

Ngoài ra bạn có thể sử dụng Add-on QuickSearch in Header 1.1.1.

Nguồn: xenforo.com​
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Hỗ trợ trực tuyến

Support Quảng cáo
Mr. San (PVS)

Skype chat, instant message

Mr. Tuấn (Blue)

Skype chat, instant message

Mr. Tuấn
0988 488 096
Mr. Trọng
0906 081 284
kinhdoanh@vnxf.vn

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Điện Lạnh Thịnh Phát
Top Bottom