header搜索框样式错乱调整
All checks were successful
Gitea Actions Official-website / deploy-dev (push) Successful in 4s
All checks were successful
Gitea Actions Official-website / deploy-dev (push) Successful in 4s
This commit is contained in:
@@ -9,7 +9,7 @@
|
||||
<!-- banner-->
|
||||
<div class="oidx-banner">
|
||||
{notempty name="focus_images"}
|
||||
<div class="swiper-container bannerswiper">
|
||||
<div class="swiper-container bannerswiper" style="background: #fff;">
|
||||
<div class="swiper-wrapper">
|
||||
{volist name="focus_images" id="fi"}
|
||||
<div class="swiper-slide">
|
||||
|
||||
@@ -324,8 +324,14 @@
|
||||
height: 14px;
|
||||
cursor: pointer;
|
||||
opacity: 0.6;
|
||||
|
||||
}
|
||||
|
||||
.search-clear-box {
|
||||
padding-right: 10px;
|
||||
}
|
||||
/* .search-clear-btn {
|
||||
border-right: 1px solid #eee;
|
||||
} */
|
||||
.search-input-box .search-clear-btn:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -334,8 +340,13 @@
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.search-submit-box {
|
||||
border-left: 1px solid #d9d9d9;
|
||||
padding-left:10px;
|
||||
max-height: 18px;
|
||||
}
|
||||
|
||||
.search-history {
|
||||
margin-top: 20px;
|
||||
}
|
||||
@@ -407,6 +418,10 @@
|
||||
font-size: 14px;
|
||||
color: #aaa;
|
||||
}
|
||||
.mobile-header-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
<header>
|
||||
<div class="mobile-header-box">
|
||||
@@ -514,9 +529,14 @@
|
||||
<img src="__IMAGES__/header/x.png" class="modal-close">
|
||||
<div class="search-input-box">
|
||||
<input type="text" placeholder="{:lang_i18n('请输入搜索关键词')}" id="searchInput">
|
||||
<img src="__IMAGES__/header/x.png" alt="{:lang_i18n('清除')}" class="search-clear-btn" id="searchClearBtn" style="display: none;">
|
||||
<span style="width: 1px; color:#d9d9d9;margin: 0 10px;">|</span>
|
||||
<img src="__IMAGES__/header/search.png" alt="{:lang_i18n('搜索')}" class="search-submit-icon" id="searchSubmit">
|
||||
|
||||
<div class="search-clear-box">
|
||||
<img src="__IMAGES__/header/x.png" alt="{:lang_i18n('清除')}" class="search-clear-btn" id="searchClearBtn" style="display: none;">
|
||||
</div>
|
||||
<!-- <span style="width: 1px; color:#d9d9d9;margin: 0 10px;">|</span> -->
|
||||
<div class="search-submit-box">
|
||||
<img src="__IMAGES__/header/search.png" alt="{:lang_i18n('搜索')}" class="search-submit-icon" id="searchSubmit">
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-history">
|
||||
<div class="search-history-header">
|
||||
@@ -844,16 +864,16 @@
|
||||
if (keyword && keyword.trim()) {
|
||||
const searchKeyword = keyword.trim();
|
||||
console.log('搜索关键词:', searchKeyword);
|
||||
addSearchHistory(searchKeyword);
|
||||
alert('搜索: ' + searchKeyword);
|
||||
searchModal.classList.remove('show');
|
||||
searchInput.value = '';
|
||||
searchClearBtn.style.display = 'none';
|
||||
} else {
|
||||
alert('请输入搜索关键词');
|
||||
}
|
||||
}
|
||||
if (searchKeyword) {
|
||||
addSearchHistory(searchKeyword);
|
||||
window.location.href = "{:url('product/search')}?keywords=" + encodeURIComponent(searchKeyword);
|
||||
searchModal.classList.remove('show');
|
||||
searchInput.value = '';
|
||||
searchClearBtn.style.display = 'none';
|
||||
}
|
||||
|
||||
}
|
||||
}12
|
||||
searchSubmit.addEventListener('click', function (e)
|
||||
{
|
||||
e.stopPropagation();
|
||||
@@ -862,6 +882,7 @@
|
||||
|
||||
searchInput.addEventListener('keypress', function (e)
|
||||
{
|
||||
console.log(e,'========e=============')
|
||||
if (e.key === 'Enter' || e.key === 'enter' || e.keyCode === 13) {
|
||||
e.preventDefault();
|
||||
doSearch(searchInput.value);
|
||||
|
||||
@@ -31,15 +31,13 @@
|
||||
<link rel="stylesheet" href="__CSS__/topic_power_prodline/footer.css">
|
||||
|
||||
{/block}
|
||||
{block name="header"}
|
||||
<!-- 重置header头为空 -->
|
||||
{/block}
|
||||
|
||||
{block name="main"}
|
||||
<a class="header" href="/">
|
||||
<!-- <a class="header" href="/">
|
||||
<div class="header-img">
|
||||
<img src="__IMAGES__/logo.png" alt="">
|
||||
</div>
|
||||
</a>
|
||||
</a> -->
|
||||
<!-- 轮播核心容器 -->
|
||||
<div class="swiper-container auto-swiper-container" >
|
||||
{notempty name="data.focus_image"}
|
||||
|
||||
Reference in New Issue
Block a user