Click show div search mới - mobi

 

**** HTML

<input type="text" placeholder="Tìm kiếm sản phẩm" class="mbipro-search form-control" id="openSearch">

-> click show qua div mới

<div id="searchOverlay">

    <div class="flex mbiflex">

        <div class="search-header" id="closeSearch">

            <i class="fa fa-angle-left" aria-hidden="true"></i>

        </div>

        <div class="search-body">

            <input type="text" placeholder="Nhập từ khóa..." class="search-input">

            <button class="btn-search">

                <i class="fa fa-search"></i>

            </button>

        </div>

    </div>    

</div>

**** JS

<script>

  $(document).ready(function(){

      $("#openSearch").focus(function(){

          $("#searchOverlay").addClass("active");

          setTimeout(function(){

              $("#searchInput").focus();

          },100);

      });

      $("#closeSearch").click(function(){

          $("#searchOverlay").removeClass("active");

      });

  });

</script>

**** CSS

#searchOverlay {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: #fff;

    z-index: 9999;

    display: none;

    flex-direction: column;

}

#searchOverlay.active {

    display: flex;

}

.search-header {

    color: #888;

    font-size: 25px;

}

#closeSearch {

    background: none;

    border: none;

    font-size: 30px;

    cursor: pointer;

}

.mbiflex {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 10px;

}

.search-body {

    position: relative;

    flex: 1;

}

.search-input {

    width: 100%;

    height: 45px;

    padding: 0 15px;

    border: 1px solid #ddd;

    border-radius: 30px;

    font-size: 16px;

}

#searchOverlay {

    opacity: 0;

    transition: 0.3s;

}

#searchOverlay.active {

    display: flex;

    opacity: 1;

}

.btn-search {

    position: absolute;

    top: 50%;

    right: 10px;

    transform: translateY(-50%);

    border: none;

    background: none;

    cursor: pointer;

    color: #888;

    font-size: 18px;

}

CAPCUT - tải về & chuyển ỗ đĩa D:/

❌ CapCut KHÔNG có bản portable chính thức

Phần mềm CapCut:

Không có bản portable chính chủ

Luôn cài vào ổ C (AppData) dù bạn chọn ổ khác

Dữ liệu cache/video có thể chiếm rất nhiều dung lượng

🔹 3 cách dùng CapCut mà KHÔNG làm nặng ổ C

✅ Cách 1 (hiệu quả nhất): Chuyển cache sang ổ D

CapCut có cho đổi thư mục lưu cache

👉 Làm như sau:

Mở CapCut

Vào Settings (Cài đặt)

Chọn Cache / Storage

Đổi đường dẫn sang:

D:\CapCutCache

👉 Sau đó:

Bấm Clear cache

Ổ C sẽ nhẹ ngay

✅ Cách 2: Cài lại nhưng redirect sang ổ D (nâng cao)

Dùng symbolic link (rất hiệu quả nếu ổ C yếu)

Ví dụ:

Cài CapCut xong

Di chuyển thư mục:

C:\Users\TênUser\AppData\Local\CapCut

→ sang:

D:\CapCut

Mở CMD (Run as admin):

mklink /D "C:\Users\TênUser\AppData\Local\CapCut" "D:\CapCut"

👉 Kết quả:

CapCut vẫn chạy bình thường

Nhưng toàn bộ dữ liệu nằm ở ổ D

✅ Cách 3: Dùng bản nhẹ hơn (khuyên dùng nếu máy yếu)

Nếu máy bạn yếu hoặc ổ C gần full:

👉 Thay vì CapCut, dùng:

Filmora (nhẹ hơn)

Shotcut (miễn phí)

VSDC Free Video Editor

--- Download

🔗 Link tải chính thức

👉 Tải CapCut tại trang chính thức

Hoặc link mirror chính chủ:

👉 <a href="https://download.capcut.jp/?utm_source=chatgpt.com">Download CapCut PC</a> (Windows/Mac)

📌 Cách tải nhanh cho bạn (PC Windows)

Bấm vào link trên

Nhấn Download / Tải xuống

Chạy file .exe để cài

Mở lên dùng luôn

------------ cách chuyển qua ổ D

✅ Làm đúng từng bước (chuẩn 100%)

🔹 Bước 1: Tạo folder ở ổ D

Bạn tạo sẵn:

D:\CapCut\User Data

👉 Có thể:

Chuột phải → New Folder

Hoặc tạo luôn cả CapCut rồi bên trong là User Data

🔹 Bước 2: Copy dữ liệu từ ổ C sang

Copy toàn bộ:

C:\Users\Administrator\AppData\Local\CapCut\User Data

👉 sang:

D:\CapCut\User Data

🔹 Bước 3: Xóa thư mục cũ ở ổ C

Sau khi copy xong:

C:\Users\Administrator\AppData\Local\CapCut\User Data

👉 XÓA hoặc rename (ví dụ: User Data_old để backup)

🔹 Bước 4: Tạo link (quan trọng nhất)

Mở CMD Run as administrator:

mklink /D "C:\Users\Administrator\AppData\Local\CapCut\User Data" "D:\CapCut\User Data"

✅ Nếu thành công sẽ thấy:

symbolic link created

--------------- vào 
D:\CapCutCache\User Data

🔥 Xóa các thư mục:

- Cache
- Temp
- GPUCache
- Code Cache

✅ Tạo file .bat để Xóa Cache



@echo off
echo Dang don dep cache CapCut...
taskkill /f /im CapCut.exe >nul 2>&1
set path=D:\CapCut\User Data
:: Xoa cache
rd /s /q "%path%\Cache"
rd /s /q "%path%\Code Cache"
rd /s /q "%path%\GPUCache"
rd /s /q "%path%\Temp"
:: Them 2 dong nay o day 👇
rd /s /q "%path%\Media Cache"
rd /s /q "%path%\Logs"
:: Tao lai folder tranh loi
mkdir "%path%\Cache"
mkdir "%path%\Code Cache"
mkdir "%path%\GPUCache"
mkdir "%path%\Temp"
echo Done! Da giai phong dung luong CapCut.
pause

Nhập bài viết trong CKEditor nhưng bị lỗi do dấu nháy

 🔥 Giải thích dễ hiểu

Copy text bình thường → không có ' → OK

Copy HTML có CSS → có ' → vỡ SQL → không lưu / lưu rỗng

👉Input SQL

$content = addslashes($_POST['txt_mieuta']);

👉Output

echo stripslashes($data[0]["content"]);

🚀 Tốt hơn (nếu muốn chuẩn hơn chút)

Dùng:

$content = mysql_real_escape_string($_POST['txt_mieuta']);

Flex co giãn dòng đầu tiên

 

## HTML

<div class="order-row">
        <div>#</div>
        <div>Tên sản phẩm</div>
        <div>Số lượng</div>
        <div>Giá</div>
</div>

## CSS

.order-row,
 .items-orders{
    display:flex;
}

.order-row > div:first-child,
.items-orders > div:first-child{
    flex:0 0 60px;
}

.order-row > div,
.items-orders > div{
    flex:1;
}

## NOTE

flex:0 0 60px nghĩa là:

grow = 0 (không giãn)

shrink = 0 (không co)

basis = 60px

→ cột đầu luôn 60px

Hiệu ứng hover div load text lên

 

**** HTML

<div class="hover-box-2">

    <span class="default-text">141.001 VNĐ</span>

    <span class="hover-text">Xem Đơn hàng</span>

</div>

**** CSS

.hover-box-2 {

    position: relative;

    overflow: hidden;

    /* width: 240px; */

    width: 180px;

    height: 50px;

    background: linear-gradient(135deg, #ffe4ec, #fff0f5);

    border-radius: 12px;

    text-align: center;

    cursor: pointer;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

    margin: 0 auto;

    transition: transform 0.3s ease;

}

.hover-box-2:hover {

    transform: scale(1.03);

}

.hover-box-2 .default-text {

    top: 0;

    color: #444;

    opacity: 1;

}

.hover-box-2:hover .default-text {

    top: -100%;

    opacity: 0;

}

.hover-box-2 .hover-text {

    top: 100%;

    color: #e91e63;

    opacity: 0;

}

.hover-box-2:hover .hover-text {

    top: 0;

    opacity: 1;

}

.hover-box-2 .default-text, .hover-box-2 .hover-text {

    position: absolute;

    width: 100%;

    left: 0;

    transition: all 0.4s ease-in-out;

    line-height: 50px;

    font-size: 18px;

    font-weight: 600;

}

Lấy userid duy nhất trong vòng lặp + Câu lệnh sql FIND_IN_SET

 Ví dụ:

pid 1 → userid 10
pid 2 → userid 10
pid 3 → userid 9

→ kết quả cần:

9,10

--------------------

$sum = 0;
$json_data = array();
$list_userid = array();

foreach($data_sp as $sp){

    $total = $sp['g_count'] * $sp['g_price'];
    $sum  += $total;
    $pid  = $sp['g_pid'];

    $shopemail = RETURN__CatalogSPShop__shopname($pid);
    $userid    = RETURN__UserID__Email($shopemail);

    /* lưu userid */
    $list_userid[] = $userid;

    $json_data[] = array(
        "gid"      => $sp['gid'],
        "g_pid"    => $sp['g_pid'],
        "g_price"  => $sp['g_price'],
        "g_point"  => $sp['g_point'],
        "g_count"  => $sp['g_count'],
        "g_code"   => $sp['g_code'],
        "g_title"  => $sp['g_title'],
        "total"    => $total,
        "userid"   => $userid,
        "is_view"  => 0
    );
}

/* lấy userid duy nhất */

$list_userid = array_unique($list_userid);

/* nếu muốn dạng chuỗi */

$userid_string = implode(",", $list_userid);

echo $userid_string;

-------------------- 

$list_userid = [10,10,9]

array_unique →

[10,9]

implode →

"10,9"


---------------------

$sql = "SELECT * 
        FROM orders
        WHERE FIND_IN_SET('$userid', order_shopids)
        ORDER BY order_date DESC";

$rs = mysql_query($sql);

Kéo xuống position-sticky giữ lại khi kéo xuống

 

.search-left .list-filters {

    position: sticky;

    top: 10px;

    padding-inline-start: 10px;

    padding-inline-end: 19px;

    padding-bottom: 10px;

    box-sizing: border-box;

    overflow-y: auto;

    overflow-x: hidden;

    max-height: calc(100vh - 103px);

    flex-shrink: 0;

    border-inline-end: 1px solid #e6e6e6;

    padding-inline-end: 1px;

}