TatianaPardoCruz / CalendarioAdviento

0 stars 0 forks source link

Html #1

Open TatianaPardoCruz opened 2 days ago

TatianaPardoCruz commented 2 days ago
<section class="cluster-calendarAdv">
    <div class="calendarioAdvientoDft" id="calendarioAdvientoDft" style="display: none;">
        <div class="Cluster-promoCount-countdown" id="calendarioAdviento-globalTimer"><b>La próxima promoción</b> empieza en: 00:00:00</div>
        <!-- Calendario de Adviento 1 -->
        <div class="calendarioAdvientoDft-banner" id="calendario1">
            <button class="calendarioAdvientoDft-close" onclick="calendarioAdvientoDftClose('calendarioAdvientoDft')">X</button>
            <a href="https://www.dafiti.com.co/tyc-alianzas/" class="btn_ga_click" onclick="sendClickEventGA(this)">
                <img class="img_ga_view"
                src="https://static.dafiti.com.co/cms/2024/NOVIEMBRE/APP/Feature-desktop2_Ofertascyber_12Nov.jpg"
                data-creative="" 
                data-name=""
                alt="" 
                width="auto" 
                height="auto" 
                data-position="" />
                <div class="calendarioDFT-timer" id="timer4">00:00:00</div>
            </a>
        </div>

        <!-- Calendario de Adviento 2 -->
        <div class="calendarioAdvientoDft-banner" id="calendario2">
            <button class="calendarioAdvientoDft-close" onclick="calendarioAdvientoDftClose('calendarioAdvientoDft')">X</button>
            <a href="https://www.dafiti.com.co/tyc-alianzas/" class="btn_ga_click" onclick="sendClickEventGA(this)">
                <img class="img_ga_view"
                src="https://static.dafiti.com.co/cms/2024/NOVIEMBRE/3PS/Feature-desktop_MH.png"
                data-creative="" 
                data-name=""
                alt="" 
                width="auto" 
                height="auto" 
                data-position="" />
                <div class="calendarioDFT-timer" id="timer4">00:00:00</div>
            </a>
        </div>

    </div>    
</section>
AmeriK88 commented 9 hours ago

Hola, no se si esto ayuda ya que no explicación sobre este issue. En principio los banners (calendario1 y calendario2), el

con clase calendarioDFT-timer tiene el mismo id="timer4". Los IDs en HTML deben ser únicos dentro del documento. Podrías usar un ID dinámico o una clase común para ambos y manejar el selector en JavaScript de manera adecuada.

Ejemplo:
< div class="calendarioDFT-timer timer1" id="timer1">00:00:00

< div class="calendarioDFT-timer timer2" id="timer2">00:00:00

Otra cosa, es preferible manejar los eventos en un archivo JavaScript externo en lugar de usarlos directamente en el atributo onclick. Esto mejora la separación de responsabilidades y facilita el mantenimiento del código.