精修页面布局-处理样式冲突导致的bug

This commit is contained in:
WindowBird 2025-10-10 08:58:56 +08:00
parent 9e7652dc78
commit c3d1d735e8

View File

@ -117,7 +117,7 @@ function initBanner() {
const $picplayer = $('#picplayer'); const $picplayer = $('#picplayer');
const $piccontent = $('#piccontent'); const $piccontent = $('#piccontent');
if ($picplayer.length === 0 || $piccontent.length === 0) { if ($picplayer.length === 0 || $piccontent.length === 0) {
console.error('轮播图容器未找到'); console.error('轮播图容器未找到');
return; return;
@ -134,7 +134,7 @@ function initBanner() {
// //
pics.forEach((pic, index) => { pics.forEach((pic, index) => {
$(`#picbtn${index}`).data('index', index); $(`#picbtn${index}`).data('index', index);
$(`#picbtn${index}`).off('click').on('click', function() { $(`#picbtn${index}`).off('click').on('click', function () {
setSelectedItem(index); setSelectedItem(index);
}); });
}); });
@ -145,15 +145,15 @@ function initBanner() {
function setSelectedItem(index) { function setSelectedItem(index) {
selectedIndex = index; selectedIndex = index;
clearInterval(playID); clearInterval(playID);
// //
$piccontent.find('img').fadeOut('fast'); $piccontent.find('img').fadeOut('fast');
// //
$(`#picitem${index}`).fadeIn('slow'); $(`#picitem${index}`).fadeIn('slow');
// //
$('#picbtns .caption').each(function(i) { $('#picbtns .caption').each(function (i) {
if (i === index) { if (i === index) {
$(this).find('span').css('backgroundColor', '#485766'); $(this).find('span').css('backgroundColor', '#485766');
} else { } else {
@ -193,7 +193,7 @@ function initBanner() {
<!-- 我们的解决方案 --> <!-- 我们的解决方案 -->
<div class="index-solut"> <div class="index-solut">
<h2>我们的解决方案</h2> <h2 style="margin: 0;">我们的解决方案</h2>
<p>通过APP+单车+智能锁实现GPS定位实时找车扫码快速开锁用车预约用车实时计费等功能</p> <p>通过APP+单车+智能锁实现GPS定位实时找车扫码快速开锁用车预约用车实时计费等功能</p>
<ul> <ul>
<li class="index-solut-li">APP</li> <li class="index-solut-li">APP</li>
@ -404,10 +404,7 @@ function initBanner() {
</template> </template>
<style scoped> <style scoped>
/* 自定义动画效果 */
.hover\:shadow-lg:hover {
transform: translateY(-2px);
}
/* 响应式字体大小 */ /* 响应式字体大小 */
@media (max-width: 640px) { @media (max-width: 640px) {