模式按鈕：使整個部分可點擊

我目前正在研究這個website，正如你可以看到我有兩個模態，一個在左邊，一個在右邊（我的圖標）。模式按鈕：使整個部分可點擊

我想要做的是保持模式按鈕在相同的位置，但要全款可點擊（與女孩和文字的圖片）。

信息：我只能使用該「我」圖標作爲模式按鈕：/和我只能編輯CSS而不是HTML。

這是可能通過單擊整個部分打開模式窗口？

這裏是一些代碼：

HTML：

<div id="ts-vcsc-modal-5397504-container" class="ts-vcsc-modal-container"> 
<div id="ts-vcsc-modal-5397504-trigger" style="" class="ts-vcsc-modal-5397504-parent nch-holder ts-vcsc-font-icon ts-font-icons ts-shortcode ts-icon-align-center "> 
<a href="#ts-vcsc-modal-5397504" class="nch-lightbox-modal no-ajaxy" data-width="1024" data-title="" data-open="false" data-delay="0" data-type="html" rel="" data-effect="slideUp" data-share="0" data-duration="5000" data-color="rgba(255,255,255,0.01)" data-lightbox-init="true"> 
<i class="ts-font-icon ts-awesome-info-circle" style="color: #ffffff; width:80px; height:80px; font-size:80px; line-height:80px;"></i></a></div> 
<div id="ts-vcsc-modal-5397504" class="ts-modal-content nch-hide-if-javascript " style="display: none; padding: 15px; background: #0076bc;"> 
<div class="ts-modal-white-header"></div><div class="ts-modal-white-frame" style=""><div class="ts-modal-white-inner"><p></p> 
<h2 style="text-align: left;"><span style="color: #ffffff;"><b>Wer seinen Mietvertrag im AQUILA bis 31.12.2016 unterzeichnet, erhält</b></span></h2> 
<p><span style="color: #ffffff;">1 Nettomietzins geschenkt bei Einzug innert 3 Monaten</span><br> 
<span style="color: #ffffff;"> 2 Nettomietzinse geschenkt bei Einzug per Dezember 2016</span></p> 
<p><span style="color: #ffffff;">Zusätzlicher Weihnachtsgutschein von Sutter Begg oder AJ Salon hair &amp; make up im Wert von CHF 1000.–</span></p> 
</div> 
</div> 
</div> 
</div>

感謝您的幫助的建議。

來源

2016-11-10 CasAnt

會發生什麼？ –

@JimFahad通過點擊整個部分打開模式窗口 – CasAnt

您是否嘗試過將整個部分放在觸發模式的錨點標記內？ – GvM

.nch-lightbox-modal.no-ajaxy { 
    width: 100%; 
    height: 100%; 
    display: block; 
    position: absolute; 
    top: 0; 
    left: 0; 
} 
.ts-font-icon.ts-awesome-info-circle { 
    color: #ffffff; 
    width: 80px; 
    height: 80px; 
    font-size: 80px; 
    line-height: 80px; 
    position: absolute; 
    bottom: 25px; 
    right: 0; 
}

嘗試給你的錨標記和圖標點擊該整段（與女孩和文字的圖片）後

來源

2016-11-10 08:19:41 GvM

由於@GvM在桌面上完美工作。移動設備上也可以做同樣的事情嗎？ – CasAnt

模式按鈕：使整個部分可點擊

回答

相關問題