דילוג לתוכן
  • חוקי הפורום
  • פופולרי
  • לא נפתר
  • משתמשים
  • חיפוש גוגל בפורום
  • צור קשר
עיצובים
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • ברירת מחדל (ללא עיצוב (ברירת מחדל))
  • ללא עיצוב (ברירת מחדל)
כיווץ
לוגו מותג
  1. דף הבית
  2. מחשבים וטכנולוגיה
  3. רשתות
  4. שיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים

שיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים

מתוזמן נעוץ נעול הועבר רשתות
134 פוסטים 22 כותבים 4.6k צפיות 18 עוקבים
  • מהישן לחדש
  • מהחדש לישן
  • הכי הרבה הצבעות
תגובה
  • תגובה כנושא
התחברו כדי לפרסם תגובה
נושא זה נמחק. רק משתמשים עם הרשאות מתאימות יוכלו לצפות בו.
  • LEVI HL מנותק
    LEVI HL מנותק
    LEVI H
    מדריכים
    כתב נערך לאחרונה על ידי LEVI H
    #44

    f56ff507-b335-43b9-b656-a875dad660ee-image.png
    מה קרה?
    בדסקטופ לא מוצג כלל, ובמובייל מוצג מוזר..
    משהו נדפק שם עם הcss?

    הצעה על דרך אפשר: ליצור פשוט iframe לעניין. ולא script src...

    יאנג בויי תגובה 1 תגובה אחרונה
    0
    • LEVI HL LEVI H

      f56ff507-b335-43b9-b656-a875dad660ee-image.png
      מה קרה?
      בדסקטופ לא מוצג כלל, ובמובייל מוצג מוזר..
      משהו נדפק שם עם הcss?

      הצעה על דרך אפשר: ליצור פשוט iframe לעניין. ולא script src...

      יאנג בויי מנותק
      יאנג בויי מנותק
      יאנג בוי
      מדריכים
      כתב נערך לאחרונה על ידי
      #45

      @LEVI-H כמו שכתבו פה, צריך להטמיע גם את הCSS מהגיטהאב.

      תגובה 1 תגובה אחרונה
      0
      • T מנותק
        T מנותק
        Tיו_
        כתב נערך לאחרונה על ידי
        #46

        איפה טעיתי
        73f90d35-93fb-4c2d-bdd3-eba69dbe54b5-image.png

        ט תגובה 1 תגובה אחרונה
        0
        • T Tיו_

          איפה טעיתי
          73f90d35-93fb-4c2d-bdd3-eba69dbe54b5-image.png

          ט מנותק
          ט מנותק
          טופטופיסט
          כתב נערך לאחרונה על ידי
          #47

          @Tיו_
          אתה יכול להראות מה עשית?

          T תגובה 1 תגובה אחרונה
          0
          • ט טופטופיסט

            @Tיו_
            אתה יכול להראות מה עשית?

            T מנותק
            T מנותק
            Tיו_
            כתב נערך לאחרונה על ידי
            #48

            @טופטופיסט כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

            @Tיו_
            אתה יכול להראות מה עשית?

            1bf6a24c-d14c-4f61-b11a-e9bfeaff0c65-image.png

            כתבתי כאן את שתי הקודים מגיט

            LEVI HL תגובה 1 תגובה אחרונה
            0
            • T Tיו_

              @טופטופיסט כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

              @Tיו_
              אתה יכול להראות מה עשית?

              1bf6a24c-d14c-4f61-b11a-e9bfeaff0c65-image.png

              כתבתי כאן את שתי הקודים מגיט

              LEVI HL מנותק
              LEVI HL מנותק
              LEVI H
              מדריכים
              כתב נערך לאחרונה על ידי
              #49

              @Tיו_ לדעתי לא כתבת לפני תג HTML
              כגון script או style

              T תגובה 1 תגובה אחרונה
              0
              • LEVI HL LEVI H

                @Tיו_ לדעתי לא כתבת לפני תג HTML
                כגון script או style

                T מנותק
                T מנותק
                Tיו_
                כתב נערך לאחרונה על ידי
                #50

                @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                @Tיו_ לדעתי לא כתבת לפני תג HTML
                כגון script או style

                יש מצב לקצת יותר הסבר אני בור בזה
                יישר כח

                LEVI HL תגובה 1 תגובה אחרונה
                0
                • T Tיו_

                  @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                  @Tיו_ לדעתי לא כתבת לפני תג HTML
                  כגון script או style

                  יש מצב לקצת יותר הסבר אני בור בזה
                  יישר כח

                  LEVI HL מנותק
                  LEVI HL מנותק
                  LEVI H
                  מדריכים
                  כתב נערך לאחרונה על ידי
                  #51

                  @Tיו_ בשמחה.
                  איך העתקת את התוכן של הקוד? העתק הדבק? רגיל?
                  אם כן, יש לך טעות קלה.
                  תוכן הקוד שהעתקת נתמך בלי תגית HTML רק כשהוא בתוך קובץ שמגדיר מהו, כגון קובץ css.

                  למעשה:
                  קח את הקוד שבקובץ css, ואל תדביק אותו ככה, אלא ככה:

                  <style>
                  
                  פה תכניס את הקוד של הcss
                  
                  </style>
                  

                  ואת הjs תכניס ככה:

                  <script>
                  
                  פה תכניס את הקוד של הjs
                  
                  </script>
                  
                  T תגובה 1 תגובה אחרונה
                  1
                  • LEVI HL LEVI H

                    @Tיו_ בשמחה.
                    איך העתקת את התוכן של הקוד? העתק הדבק? רגיל?
                    אם כן, יש לך טעות קלה.
                    תוכן הקוד שהעתקת נתמך בלי תגית HTML רק כשהוא בתוך קובץ שמגדיר מהו, כגון קובץ css.

                    למעשה:
                    קח את הקוד שבקובץ css, ואל תדביק אותו ככה, אלא ככה:

                    <style>
                    
                    פה תכניס את הקוד של הcss
                    
                    </style>
                    

                    ואת הjs תכניס ככה:

                    <script>
                    
                    פה תכניס את הקוד של הjs
                    
                    </script>
                    
                    T מנותק
                    T מנותק
                    Tיו_
                    כתב נערך לאחרונה על ידי Tיו_
                    #52

                    @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                    @Tיו_ בשמחה.
                    איך העתקת את התוכן של הקוד? העתק הדבק? רגיל?
                    אם כן, יש לך טעות קלה.
                    תוכן הקוד שהעתקת נתמך בלי תגית HTML רק כשהוא בתוך קובץ שמגדיר מהו, כגון קובץ css.

                    למעשה:
                    קח את הקוד שבקובץ css, ואל תדביק אותו ככה, אלא ככה:

                    <style>
                    
                    פה תכניס את הקוד של הcss
                    
                    </style>
                    

                    ואת הjs תכניס ככה:

                    <script>
                    
                    פה תכניס את הקוד של הjs
                    
                    </script>
                    

                    וואואו יישר כח זה עובד רק לא רואים את התמונה של הבאנר אבל לפחות זה עובד
                    אם היה אפשר אלף לייקים היית מקבל

                    f8b53604-3edf-41b7-bf6f-81725ed7e7d5-image.png

                    LEVI HL תגובה 1 תגובה אחרונה
                    0
                    • T Tיו_

                      @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                      @Tיו_ בשמחה.
                      איך העתקת את התוכן של הקוד? העתק הדבק? רגיל?
                      אם כן, יש לך טעות קלה.
                      תוכן הקוד שהעתקת נתמך בלי תגית HTML רק כשהוא בתוך קובץ שמגדיר מהו, כגון קובץ css.

                      למעשה:
                      קח את הקוד שבקובץ css, ואל תדביק אותו ככה, אלא ככה:

                      <style>
                      
                      פה תכניס את הקוד של הcss
                      
                      </style>
                      

                      ואת הjs תכניס ככה:

                      <script>
                      
                      פה תכניס את הקוד של הjs
                      
                      </script>
                      

                      וואואו יישר כח זה עובד רק לא רואים את התמונה של הבאנר אבל לפחות זה עובד
                      אם היה אפשר אלף לייקים היית מקבל

                      f8b53604-3edf-41b7-bf6f-81725ed7e7d5-image.png

                      LEVI HL מנותק
                      LEVI HL מנותק
                      LEVI H
                      מדריכים
                      כתב נערך לאחרונה על ידי LEVI H
                      #53

                      @Tיו_ תעלה גם את התמונה שנמצאת בgit לתוך האתר שלך, ותשנה בקוד html את נתיב התמונה.
                      (או שתעלה פה רגע צילום מסך של הכל הקוד שהעלת באתר שלך)

                      T תגובה 1 תגובה אחרונה
                      0
                      • LEVI HL LEVI H

                        @Tיו_ תעלה גם את התמונה שנמצאת בgit לתוך האתר שלך, ותשנה בקוד html את נתיב התמונה.
                        (או שתעלה פה רגע צילום מסך של הכל הקוד שהעלת באתר שלך)

                        T מנותק
                        T מנותק
                        Tיו_
                        כתב נערך לאחרונה על ידי
                        #54

                        @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                        @Tיו_ תעלה גם את התמונה שנמצאת בgit לתוך האתר שלך, ותשנה בקוד html את נתיב התמונה.
                        (או שתעלה פה רגע צילום מסך של הכל הקוד שהעלת באתר שלך)

                        אני לא יכול לשלוח צילומסך כי הקוד נימצא בריבוע קטן אם אני יעשה העתק הדבק זה בסדר?

                        LEVI HL תגובה 1 תגובה אחרונה
                        0
                        • T Tיו_

                          @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                          @Tיו_ תעלה גם את התמונה שנמצאת בgit לתוך האתר שלך, ותשנה בקוד html את נתיב התמונה.
                          (או שתעלה פה רגע צילום מסך של הכל הקוד שהעלת באתר שלך)

                          אני לא יכול לשלוח צילומסך כי הקוד נימצא בריבוע קטן אם אני יעשה העתק הדבק זה בסדר?

                          LEVI HL מנותק
                          LEVI HL מנותק
                          LEVI H
                          מדריכים
                          כתב נערך לאחרונה על ידי
                          #55

                          @Tיו_ כן, מעולה.

                          T תגובה 1 תגובה אחרונה
                          0
                          • LEVI HL LEVI H

                            @Tיו_ כן, מעולה.

                            T מנותק
                            T מנותק
                            Tיו_
                            כתב נערך לאחרונה על ידי
                            #56

                            @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                            @Tיו_ כן, מעולה.

                            <style>
                             
                            @import url('https://fonts.googleapis.com/css2?family=Bona+Nova+SC&display=swap');
                            
                            :root {
                                --background-color: #ffffff;
                                --overlay-background: rgba(114, 42, 42, 0.5);
                                --border-color: #444;
                                --text-color: #ffffff;
                                --highlight-color: #ffffff;
                                --secondary-text-color: #bbb;
                                --shadow-color: rgba(255, 255, 255, 0.1);
                                --overlay-opacity: 0.5;
                                --unit-background-color: rgba(142, 136, 136, 0.5);
                            }
                            
                            body {
                                background-color: var(--background-color);
                                margin: 0;
                                font-family: 'Bona Nova SC', Arial, sans-serif;
                                color: var(--text-color);
                            }
                            
                            #popup-container {
                                position: fixed;
                                bottom: 30px;
                                right: 30px;
                                background-color: var(--overlay-background);
                                border-radius: 15px;
                                padding: 20px;
                                box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
                                z-index: 1000;
                                overflow: hidden;
                                max-width: 350px;
                                width: auto;
                                height: auto;
                                box-sizing: border-box;
                                text-align: center;
                                transition: transform 0.3s ease, box-shadow 0.3s ease;
                                transform: translateY(-10px);
                            }
                            
                            #popup-container:hover {
                                transform: translateY(-15px);
                                box-shadow: 0 18px 36px rgba(0, 0, 0, 0.3);
                            }
                            
                            #popup-background {
                                position: absolute;
                                top: 0;
                                left: 0;
                                width: 100%;
                                height: 100%;
                                background-image: url('בית המקדש.jpg');
                                background-size: cover;
                                background-position: center;
                                mix-blend-mode: overlay;
                                opacity: var(--overlay-opacity);
                                z-index: 0;
                                border-radius: 15px;
                                filter: blur(1px);
                            }
                            
                            #close-btn {
                                position: absolute;
                                top: 5px;
                                left: 5px;
                                background-color: transparent;
                                border: none;
                                color: var(--text-color);
                                font-size: 16px;
                                cursor: pointer;
                                z-index: 2;
                            }
                            
                            #temple-counter {
                                position: relative;
                                z-index: 1;
                            }
                            
                            #temple-counter h2 {
                                color: var(--highlight-color);
                                font-size: 18px;
                                margin-bottom: 10px;
                                font-weight: 700;
                                line-height: 1.2;
                            }
                            
                            .time-unit {
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                margin-bottom: 10px;
                                flex-direction: row-reverse;
                            }
                            
                            .unit {
                                display: flex;
                                flex-direction: column;
                                align-items: center;
                                margin: 0 5px;
                            }
                            
                            .unit-title {
                                font-size: 12px;
                                color: var(--secondary-text-color);
                                margin-top: 4px;
                            }
                            
                            .unit-value-container {
                                display: flex;
                                flex-direction: row;
                                justify-content: center;
                                align-items: center;
                            }
                            
                            .unit-value {
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                border: none;
                                padding: 5px;
                                border-radius: 6px;
                                background-color: var(--unit-background-color);
                                font-family: 'Digital-7', Arial, sans-serif;
                                font-size: 20px;
                                font-weight: 700;
                                color: var(--text-color);
                                min-width: 20px;
                                width: 20px;
                                margin: 0 1px;
                                height: 30px;
                                line-height: 30px;
                                text-align: center;
                                box-sizing: border-box;
                            }
                            
                            .colon {
                                font-size: 16px;
                                line-height: 30px;
                                font-family: 'Digital-7', Arial, sans-serif;
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                height: 30px;
                                margin: 0 2px;
                                position: relative;
                                top: -8px;
                            }
                            
                            .action {
                                font-size: 14px;
                                color: var(--highlight-color);
                                margin-top: 10px;
                                text-transform: uppercase;
                                font-weight: 700;
                            }
                            
                            @media (max-width: 480px) {
                                #popup-container {
                                    width: 90vw;
                                    padding: 5px;
                                    right: 5vw;
                                }
                            
                                .unit-value {
                                    font-size: 16px;
                                    height: auto;
                                }
                            
                                .colon {
                                    font-size: 14px;
                                    line-height: 16px;
                                }
                            }
                             
                            </style>
                            <script>
                             
                            const link = document.createElement('link');
                            link.rel = 'stylesheet';
                            link.href = 'style.css';
                            document.head.appendChild(link);
                            
                            const popupContainer = document.createElement('div');
                            popupContainer.id = 'popup-container';
                            
                            popupContainer.innerHTML = `
                                <div id="popup-background"></div>
                                <button id="close-btn" onclick="closePopup()" aria-label="סגור">✕</button>
                                <div id="temple-counter">
                                    <h2>זמן שחלף מאז חורבן בית המקדש</h2>
                                    <div class="time-unit" id="time-units-container"></div>
                                    <div class="action">"והראנו בבניינו ושמחנו בתיקונו"</div>
                                </div>
                            `;
                            
                            document.body.appendChild(popupContainer);
                            
                            
                            const DESTRUCTION_YEAR = 70;
                            
                            function getTishaBAvDate(year) {
                                return new Date(year, 7, 12);
                            }
                            
                            function calculateTimeSinceDestruction() {
                                const today = new Date();
                                const tishaBAvDate = getTishaBAvDate(today.getFullYear());
                                const timeSinceDestruction = today - tishaBAvDate;
                                const daysSinceDestruction = Math.floor(timeSinceDestruction / (1000 * 60 * 60 * 24)) - 1;
                                const yearsSinceDestruction = today.getFullYear() - DESTRUCTION_YEAR;
                            
                                const times = {
                                    days: daysSinceDestruction,
                                    years: yearsSinceDestruction,
                                };
                            
                                const timeUnitsContainer = document.getElementById('time-units-container');
                                timeUnitsContainer.innerHTML = '';
                            
                            
                                const TIME_UNITS = ['days', 'years'];
                            
                                TIME_UNITS.forEach((unit, index) => {
                                    let unitValue = times[unit].toString().padStart(2, '0');
                            
                                    const unitContainer = document.createElement('div');
                                    unitContainer.classList.add('unit');
                            
                                    const valueContainer = document.createElement('div');
                                    valueContainer.classList.add('unit-value-container');
                            
                                    unitValue.split('').forEach(number => {
                                        const numberElement = document.createElement('div');
                                        numberElement.classList.add('unit-value');
                                        numberElement.textContent = number;
                                        valueContainer.appendChild(numberElement);
                                    });
                            
                                    unitContainer.appendChild(valueContainer);
                            
                                    const titleElement = document.createElement('div');
                                    titleElement.classList.add('unit-title');
                                    titleElement.textContent = unit === 'years' ? 'שנים' : 'ימים';
                            
                                    unitContainer.appendChild(titleElement);
                                    timeUnitsContainer.appendChild(unitContainer);
                            
                                    if (index < TIME_UNITS.length - 1) {
                                        const colonElement = document.createElement('div');
                                        colonElement.classList.add('colon');
                                        colonElement.textContent = ':';
                                        timeUnitsContainer.appendChild(colonElement);
                                    }
                                });
                            
                                requestAnimationFrame(calculateTimeSinceDestruction);
                            }
                            
                            calculateTimeSinceDestruction();
                            
                            function closePopup() {
                                const popupContainer = document.getElementById('popup-container');
                                if (popupContainer) {
                                    popupContainer.style.display = 'none';
                                }
                            }
                             
                            </script>
                            
                            ט תגובה 1 תגובה אחרונה
                            0
                            • LEVI HL מנותק
                              LEVI HL מנותק
                              LEVI H
                              מדריכים
                              כתב נערך לאחרונה על ידי LEVI H
                              #57

                              זה הקוד שלך:
                              תעלה את התמונה לאתר, תעתיק את כתובת התמונה, ותכניס בקוד במקום המסומן לכך:

                              <style>
                              
                              #popup-background {
                                  position: absolute;
                                  top: 0;
                                  left: 0;
                                  width: 100%;
                                  height: 100%;
                                  background-image: url('נתיב-התמונה');
                                  background-size: cover;
                                  background-position: center;
                                  mix-blend-mode: overlay;
                                  opacity: var(--overlay-opacity);
                                  z-index: 0;
                                  border-radius: 15px;
                                  filter: blur(1px);
                              }
                              
                               
                              @import url('https://fonts.googleapis.com/css2?family=Bona+Nova+SC&display=swap');
                               
                              :root {
                                  --background-color: #ffffff;
                                  --overlay-background: rgba(114, 42, 42, 0.5);
                                  --border-color: #444;
                                  --text-color: #ffffff;
                                  --highlight-color: #ffffff;
                                  --secondary-text-color: #bbb;
                                  --shadow-color: rgba(255, 255, 255, 0.1);
                                  --overlay-opacity: 0.5;
                                  --unit-background-color: rgba(142, 136, 136, 0.5);
                              }
                               
                              body {
                                  background-color: var(--background-color);
                                  margin: 0;
                                  font-family: 'Bona Nova SC', Arial, sans-serif;
                                  color: var(--text-color);
                              }
                               
                              #popup-container {
                                  position: fixed;
                                  bottom: 30px;
                                  right: 30px;
                                  background-color: var(--overlay-background);
                                  border-radius: 15px;
                                  padding: 20px;
                                  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
                                  z-index: 1000;
                                  overflow: hidden;
                                  max-width: 350px;
                                  width: auto;
                                  height: auto;
                                  box-sizing: border-box;
                                  text-align: center;
                                  transition: transform 0.3s ease, box-shadow 0.3s ease;
                                  transform: translateY(-10px);
                              }
                               
                              #popup-container:hover {
                                  transform: translateY(-15px);
                                  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.3);
                              }
                               
                              
                               
                              #close-btn {
                                  position: absolute;
                                  top: 5px;
                                  left: 5px;
                                  background-color: transparent;
                                  border: none;
                                  color: var(--text-color);
                                  font-size: 16px;
                                  cursor: pointer;
                                  z-index: 2;
                              }
                               
                              #temple-counter {
                                  position: relative;
                                  z-index: 1;
                              }
                               
                              #temple-counter h2 {
                                  color: var(--highlight-color);
                                  font-size: 18px;
                                  margin-bottom: 10px;
                                  font-weight: 700;
                                  line-height: 1.2;
                              }
                               
                              .time-unit {
                                  display: flex;
                                  justify-content: center;
                                  align-items: center;
                                  margin-bottom: 10px;
                                  flex-direction: row-reverse;
                              }
                               
                              .unit {
                                  display: flex;
                                  flex-direction: column;
                                  align-items: center;
                                  margin: 0 5px;
                              }
                               
                              .unit-title {
                                  font-size: 12px;
                                  color: var(--secondary-text-color);
                                  margin-top: 4px;
                              }
                               
                              .unit-value-container {
                                  display: flex;
                                  flex-direction: row;
                                  justify-content: center;
                                  align-items: center;
                              }
                               
                              .unit-value {
                                  display: flex;
                                  align-items: center;
                                  justify-content: center;
                                  border: none;
                                  padding: 5px;
                                  border-radius: 6px;
                                  background-color: var(--unit-background-color);
                                  font-family: 'Digital-7', Arial, sans-serif;
                                  font-size: 20px;
                                  font-weight: 700;
                                  color: var(--text-color);
                                  min-width: 20px;
                                  width: 20px;
                                  margin: 0 1px;
                                  height: 30px;
                                  line-height: 30px;
                                  text-align: center;
                                  box-sizing: border-box;
                              }
                               
                              .colon {
                                  font-size: 16px;
                                  line-height: 30px;
                                  font-family: 'Digital-7', Arial, sans-serif;
                                  display: flex;
                                  align-items: center;
                                  justify-content: center;
                                  height: 30px;
                                  margin: 0 2px;
                                  position: relative;
                                  top: -8px;
                              }
                               
                              .action {
                                  font-size: 14px;
                                  color: var(--highlight-color);
                                  margin-top: 10px;
                                  text-transform: uppercase;
                                  font-weight: 700;
                              }
                               
                              @media (max-width: 480px) {
                                  #popup-container {
                                      width: 90vw;
                                      padding: 5px;
                                      right: 5vw;
                                  }
                               
                                  .unit-value {
                                      font-size: 16px;
                                      height: auto;
                                  }
                               
                                  .colon {
                                      font-size: 14px;
                                      line-height: 16px;
                                  }
                              }
                               
                              </style>
                              <script>
                               
                              const link = document.createElement('link');
                              link.rel = 'stylesheet';
                              link.href = 'style.css';
                              document.head.appendChild(link);
                               
                              const popupContainer = document.createElement('div');
                              popupContainer.id = 'popup-container';
                               
                              popupContainer.innerHTML = `
                                  <div id="popup-background"></div>
                                  <button id="close-btn" onclick="closePopup()" aria-label="סגור">✕</button>
                                  <div id="temple-counter">
                                      <h2>זמן שחלף מאז חורבן בית המקדש</h2>
                                      <div class="time-unit" id="time-units-container"></div>
                                      <div class="action">"והראנו בבניינו ושמחנו בתיקונו"</div>
                                  </div>
                              `;
                               
                              document.body.appendChild(popupContainer);
                               
                               
                              const DESTRUCTION_YEAR = 70;
                               
                              function getTishaBAvDate(year) {
                                  return new Date(year, 7, 12);
                              }
                               
                              function calculateTimeSinceDestruction() {
                                  const today = new Date();
                                  const tishaBAvDate = getTishaBAvDate(today.getFullYear());
                                  const timeSinceDestruction = today - tishaBAvDate;
                                  const daysSinceDestruction = Math.floor(timeSinceDestruction / (1000 * 60 * 60 * 24)) - 1;
                                  const yearsSinceDestruction = today.getFullYear() - DESTRUCTION_YEAR;
                               
                                  const times = {
                                      days: daysSinceDestruction,
                                      years: yearsSinceDestruction,
                                  };
                               
                                  const timeUnitsContainer = document.getElementById('time-units-container');
                                  timeUnitsContainer.innerHTML = '';
                               
                               
                                  const TIME_UNITS = ['days', 'years'];
                               
                                  TIME_UNITS.forEach((unit, index) => {
                                      let unitValue = times[unit].toString().padStart(2, '0');
                               
                                      const unitContainer = document.createElement('div');
                                      unitContainer.classList.add('unit');
                               
                                      const valueContainer = document.createElement('div');
                                      valueContainer.classList.add('unit-value-container');
                               
                                      unitValue.split('').forEach(number => {
                                          const numberElement = document.createElement('div');
                                          numberElement.classList.add('unit-value');
                                          numberElement.textContent = number;
                                          valueContainer.appendChild(numberElement);
                                      });
                               
                                      unitContainer.appendChild(valueContainer);
                               
                                      const titleElement = document.createElement('div');
                                      titleElement.classList.add('unit-title');
                                      titleElement.textContent = unit === 'years' ? 'שנים' : 'ימים';
                               
                                      unitContainer.appendChild(titleElement);
                                      timeUnitsContainer.appendChild(unitContainer);
                               
                                      if (index < TIME_UNITS.length - 1) {
                                          const colonElement = document.createElement('div');
                                          colonElement.classList.add('colon');
                                          colonElement.textContent = ':';
                                          timeUnitsContainer.appendChild(colonElement);
                                      }
                                  });
                               
                                  requestAnimationFrame(calculateTimeSinceDestruction);
                              }
                               
                              calculateTimeSinceDestruction();
                               
                              function closePopup() {
                                  const popupContainer = document.getElementById('popup-container');
                                  if (popupContainer) {
                                      popupContainer.style.display = 'none';
                                  }
                              }
                               
                              </script>
                              

                              241848e9-db55-4331-bbe5-d524c1d5837e-image.png ספויילר

                              T תגובה 1 תגובה אחרונה
                              0
                              • LEVI HL LEVI H

                                זה הקוד שלך:
                                תעלה את התמונה לאתר, תעתיק את כתובת התמונה, ותכניס בקוד במקום המסומן לכך:

                                <style>
                                
                                #popup-background {
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    width: 100%;
                                    height: 100%;
                                    background-image: url('נתיב-התמונה');
                                    background-size: cover;
                                    background-position: center;
                                    mix-blend-mode: overlay;
                                    opacity: var(--overlay-opacity);
                                    z-index: 0;
                                    border-radius: 15px;
                                    filter: blur(1px);
                                }
                                
                                 
                                @import url('https://fonts.googleapis.com/css2?family=Bona+Nova+SC&display=swap');
                                 
                                :root {
                                    --background-color: #ffffff;
                                    --overlay-background: rgba(114, 42, 42, 0.5);
                                    --border-color: #444;
                                    --text-color: #ffffff;
                                    --highlight-color: #ffffff;
                                    --secondary-text-color: #bbb;
                                    --shadow-color: rgba(255, 255, 255, 0.1);
                                    --overlay-opacity: 0.5;
                                    --unit-background-color: rgba(142, 136, 136, 0.5);
                                }
                                 
                                body {
                                    background-color: var(--background-color);
                                    margin: 0;
                                    font-family: 'Bona Nova SC', Arial, sans-serif;
                                    color: var(--text-color);
                                }
                                 
                                #popup-container {
                                    position: fixed;
                                    bottom: 30px;
                                    right: 30px;
                                    background-color: var(--overlay-background);
                                    border-radius: 15px;
                                    padding: 20px;
                                    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
                                    z-index: 1000;
                                    overflow: hidden;
                                    max-width: 350px;
                                    width: auto;
                                    height: auto;
                                    box-sizing: border-box;
                                    text-align: center;
                                    transition: transform 0.3s ease, box-shadow 0.3s ease;
                                    transform: translateY(-10px);
                                }
                                 
                                #popup-container:hover {
                                    transform: translateY(-15px);
                                    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.3);
                                }
                                 
                                
                                 
                                #close-btn {
                                    position: absolute;
                                    top: 5px;
                                    left: 5px;
                                    background-color: transparent;
                                    border: none;
                                    color: var(--text-color);
                                    font-size: 16px;
                                    cursor: pointer;
                                    z-index: 2;
                                }
                                 
                                #temple-counter {
                                    position: relative;
                                    z-index: 1;
                                }
                                 
                                #temple-counter h2 {
                                    color: var(--highlight-color);
                                    font-size: 18px;
                                    margin-bottom: 10px;
                                    font-weight: 700;
                                    line-height: 1.2;
                                }
                                 
                                .time-unit {
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    margin-bottom: 10px;
                                    flex-direction: row-reverse;
                                }
                                 
                                .unit {
                                    display: flex;
                                    flex-direction: column;
                                    align-items: center;
                                    margin: 0 5px;
                                }
                                 
                                .unit-title {
                                    font-size: 12px;
                                    color: var(--secondary-text-color);
                                    margin-top: 4px;
                                }
                                 
                                .unit-value-container {
                                    display: flex;
                                    flex-direction: row;
                                    justify-content: center;
                                    align-items: center;
                                }
                                 
                                .unit-value {
                                    display: flex;
                                    align-items: center;
                                    justify-content: center;
                                    border: none;
                                    padding: 5px;
                                    border-radius: 6px;
                                    background-color: var(--unit-background-color);
                                    font-family: 'Digital-7', Arial, sans-serif;
                                    font-size: 20px;
                                    font-weight: 700;
                                    color: var(--text-color);
                                    min-width: 20px;
                                    width: 20px;
                                    margin: 0 1px;
                                    height: 30px;
                                    line-height: 30px;
                                    text-align: center;
                                    box-sizing: border-box;
                                }
                                 
                                .colon {
                                    font-size: 16px;
                                    line-height: 30px;
                                    font-family: 'Digital-7', Arial, sans-serif;
                                    display: flex;
                                    align-items: center;
                                    justify-content: center;
                                    height: 30px;
                                    margin: 0 2px;
                                    position: relative;
                                    top: -8px;
                                }
                                 
                                .action {
                                    font-size: 14px;
                                    color: var(--highlight-color);
                                    margin-top: 10px;
                                    text-transform: uppercase;
                                    font-weight: 700;
                                }
                                 
                                @media (max-width: 480px) {
                                    #popup-container {
                                        width: 90vw;
                                        padding: 5px;
                                        right: 5vw;
                                    }
                                 
                                    .unit-value {
                                        font-size: 16px;
                                        height: auto;
                                    }
                                 
                                    .colon {
                                        font-size: 14px;
                                        line-height: 16px;
                                    }
                                }
                                 
                                </style>
                                <script>
                                 
                                const link = document.createElement('link');
                                link.rel = 'stylesheet';
                                link.href = 'style.css';
                                document.head.appendChild(link);
                                 
                                const popupContainer = document.createElement('div');
                                popupContainer.id = 'popup-container';
                                 
                                popupContainer.innerHTML = `
                                    <div id="popup-background"></div>
                                    <button id="close-btn" onclick="closePopup()" aria-label="סגור">✕</button>
                                    <div id="temple-counter">
                                        <h2>זמן שחלף מאז חורבן בית המקדש</h2>
                                        <div class="time-unit" id="time-units-container"></div>
                                        <div class="action">"והראנו בבניינו ושמחנו בתיקונו"</div>
                                    </div>
                                `;
                                 
                                document.body.appendChild(popupContainer);
                                 
                                 
                                const DESTRUCTION_YEAR = 70;
                                 
                                function getTishaBAvDate(year) {
                                    return new Date(year, 7, 12);
                                }
                                 
                                function calculateTimeSinceDestruction() {
                                    const today = new Date();
                                    const tishaBAvDate = getTishaBAvDate(today.getFullYear());
                                    const timeSinceDestruction = today - tishaBAvDate;
                                    const daysSinceDestruction = Math.floor(timeSinceDestruction / (1000 * 60 * 60 * 24)) - 1;
                                    const yearsSinceDestruction = today.getFullYear() - DESTRUCTION_YEAR;
                                 
                                    const times = {
                                        days: daysSinceDestruction,
                                        years: yearsSinceDestruction,
                                    };
                                 
                                    const timeUnitsContainer = document.getElementById('time-units-container');
                                    timeUnitsContainer.innerHTML = '';
                                 
                                 
                                    const TIME_UNITS = ['days', 'years'];
                                 
                                    TIME_UNITS.forEach((unit, index) => {
                                        let unitValue = times[unit].toString().padStart(2, '0');
                                 
                                        const unitContainer = document.createElement('div');
                                        unitContainer.classList.add('unit');
                                 
                                        const valueContainer = document.createElement('div');
                                        valueContainer.classList.add('unit-value-container');
                                 
                                        unitValue.split('').forEach(number => {
                                            const numberElement = document.createElement('div');
                                            numberElement.classList.add('unit-value');
                                            numberElement.textContent = number;
                                            valueContainer.appendChild(numberElement);
                                        });
                                 
                                        unitContainer.appendChild(valueContainer);
                                 
                                        const titleElement = document.createElement('div');
                                        titleElement.classList.add('unit-title');
                                        titleElement.textContent = unit === 'years' ? 'שנים' : 'ימים';
                                 
                                        unitContainer.appendChild(titleElement);
                                        timeUnitsContainer.appendChild(unitContainer);
                                 
                                        if (index < TIME_UNITS.length - 1) {
                                            const colonElement = document.createElement('div');
                                            colonElement.classList.add('colon');
                                            colonElement.textContent = ':';
                                            timeUnitsContainer.appendChild(colonElement);
                                        }
                                    });
                                 
                                    requestAnimationFrame(calculateTimeSinceDestruction);
                                }
                                 
                                calculateTimeSinceDestruction();
                                 
                                function closePopup() {
                                    const popupContainer = document.getElementById('popup-container');
                                    if (popupContainer) {
                                        popupContainer.style.display = 'none';
                                    }
                                }
                                 
                                </script>
                                

                                241848e9-db55-4331-bbe5-d524c1d5837e-image.png ספויילר

                                T מנותק
                                T מנותק
                                Tיו_
                                כתב נערך לאחרונה על ידי
                                #58

                                @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                                זה הקוד שלך:
                                תעלה את התמונה לאתר, תעתיק את כתובת התמונה, ותכניס בקוד במקום המסומן לכך:

                                <style>
                                
                                #popup-background {
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    width: 100%;
                                    height: 100%;
                                    background-image: url('נתיב-התמונה');
                                    background-size: cover;
                                    background-position: center;
                                    mix-blend-mode: overlay;
                                    opacity: var(--overlay-opacity);
                                    z-index: 0;
                                    border-radius: 15px;
                                    filter: blur(1px);
                                }
                                
                                 
                                @import url('https://fonts.googleapis.com/css2?family=Bona+Nova+SC&display=swap');
                                 
                                :root {
                                    --background-color: #ffffff;
                                    --overlay-background: rgba(114, 42, 42, 0.5);
                                    --border-color: #444;
                                    --text-color: #ffffff;
                                    --highlight-color: #ffffff;
                                    --secondary-text-color: #bbb;
                                    --shadow-color: rgba(255, 255, 255, 0.1);
                                    --overlay-opacity: 0.5;
                                    --unit-background-color: rgba(142, 136, 136, 0.5);
                                }
                                 
                                body {
                                    background-color: var(--background-color);
                                    margin: 0;
                                    font-family: 'Bona Nova SC', Arial, sans-serif;
                                    color: var(--text-color);
                                }
                                 
                                #popup-container {
                                    position: fixed;
                                    bottom: 30px;
                                    right: 30px;
                                    background-color: var(--overlay-background);
                                    border-radius: 15px;
                                    padding: 20px;
                                    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
                                    z-index: 1000;
                                    overflow: hidden;
                                    max-width: 350px;
                                    width: auto;
                                    height: auto;
                                    box-sizing: border-box;
                                    text-align: center;
                                    transition: transform 0.3s ease, box-shadow 0.3s ease;
                                    transform: translateY(-10px);
                                }
                                 
                                #popup-container:hover {
                                    transform: translateY(-15px);
                                    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.3);
                                }
                                 
                                
                                 
                                #close-btn {
                                    position: absolute;
                                    top: 5px;
                                    left: 5px;
                                    background-color: transparent;
                                    border: none;
                                    color: var(--text-color);
                                    font-size: 16px;
                                    cursor: pointer;
                                    z-index: 2;
                                }
                                 
                                #temple-counter {
                                    position: relative;
                                    z-index: 1;
                                }
                                 
                                #temple-counter h2 {
                                    color: var(--highlight-color);
                                    font-size: 18px;
                                    margin-bottom: 10px;
                                    font-weight: 700;
                                    line-height: 1.2;
                                }
                                 
                                .time-unit {
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    margin-bottom: 10px;
                                    flex-direction: row-reverse;
                                }
                                 
                                .unit {
                                    display: flex;
                                    flex-direction: column;
                                    align-items: center;
                                    margin: 0 5px;
                                }
                                 
                                .unit-title {
                                    font-size: 12px;
                                    color: var(--secondary-text-color);
                                    margin-top: 4px;
                                }
                                 
                                .unit-value-container {
                                    display: flex;
                                    flex-direction: row;
                                    justify-content: center;
                                    align-items: center;
                                }
                                 
                                .unit-value {
                                    display: flex;
                                    align-items: center;
                                    justify-content: center;
                                    border: none;
                                    padding: 5px;
                                    border-radius: 6px;
                                    background-color: var(--unit-background-color);
                                    font-family: 'Digital-7', Arial, sans-serif;
                                    font-size: 20px;
                                    font-weight: 700;
                                    color: var(--text-color);
                                    min-width: 20px;
                                    width: 20px;
                                    margin: 0 1px;
                                    height: 30px;
                                    line-height: 30px;
                                    text-align: center;
                                    box-sizing: border-box;
                                }
                                 
                                .colon {
                                    font-size: 16px;
                                    line-height: 30px;
                                    font-family: 'Digital-7', Arial, sans-serif;
                                    display: flex;
                                    align-items: center;
                                    justify-content: center;
                                    height: 30px;
                                    margin: 0 2px;
                                    position: relative;
                                    top: -8px;
                                }
                                 
                                .action {
                                    font-size: 14px;
                                    color: var(--highlight-color);
                                    margin-top: 10px;
                                    text-transform: uppercase;
                                    font-weight: 700;
                                }
                                 
                                @media (max-width: 480px) {
                                    #popup-container {
                                        width: 90vw;
                                        padding: 5px;
                                        right: 5vw;
                                    }
                                 
                                    .unit-value {
                                        font-size: 16px;
                                        height: auto;
                                    }
                                 
                                    .colon {
                                        font-size: 14px;
                                        line-height: 16px;
                                    }
                                }
                                 
                                </style>
                                <script>
                                 
                                const link = document.createElement('link');
                                link.rel = 'stylesheet';
                                link.href = 'style.css';
                                document.head.appendChild(link);
                                 
                                const popupContainer = document.createElement('div');
                                popupContainer.id = 'popup-container';
                                 
                                popupContainer.innerHTML = `
                                    <div id="popup-background"></div>
                                    <button id="close-btn" onclick="closePopup()" aria-label="סגור">✕</button>
                                    <div id="temple-counter">
                                        <h2>זמן שחלף מאז חורבן בית המקדש</h2>
                                        <div class="time-unit" id="time-units-container"></div>
                                        <div class="action">"והראנו בבניינו ושמחנו בתיקונו"</div>
                                    </div>
                                `;
                                 
                                document.body.appendChild(popupContainer);
                                 
                                 
                                const DESTRUCTION_YEAR = 70;
                                 
                                function getTishaBAvDate(year) {
                                    return new Date(year, 7, 12);
                                }
                                 
                                function calculateTimeSinceDestruction() {
                                    const today = new Date();
                                    const tishaBAvDate = getTishaBAvDate(today.getFullYear());
                                    const timeSinceDestruction = today - tishaBAvDate;
                                    const daysSinceDestruction = Math.floor(timeSinceDestruction / (1000 * 60 * 60 * 24)) - 1;
                                    const yearsSinceDestruction = today.getFullYear() - DESTRUCTION_YEAR;
                                 
                                    const times = {
                                        days: daysSinceDestruction,
                                        years: yearsSinceDestruction,
                                    };
                                 
                                    const timeUnitsContainer = document.getElementById('time-units-container');
                                    timeUnitsContainer.innerHTML = '';
                                 
                                 
                                    const TIME_UNITS = ['days', 'years'];
                                 
                                    TIME_UNITS.forEach((unit, index) => {
                                        let unitValue = times[unit].toString().padStart(2, '0');
                                 
                                        const unitContainer = document.createElement('div');
                                        unitContainer.classList.add('unit');
                                 
                                        const valueContainer = document.createElement('div');
                                        valueContainer.classList.add('unit-value-container');
                                 
                                        unitValue.split('').forEach(number => {
                                            const numberElement = document.createElement('div');
                                            numberElement.classList.add('unit-value');
                                            numberElement.textContent = number;
                                            valueContainer.appendChild(numberElement);
                                        });
                                 
                                        unitContainer.appendChild(valueContainer);
                                 
                                        const titleElement = document.createElement('div');
                                        titleElement.classList.add('unit-title');
                                        titleElement.textContent = unit === 'years' ? 'שנים' : 'ימים';
                                 
                                        unitContainer.appendChild(titleElement);
                                        timeUnitsContainer.appendChild(unitContainer);
                                 
                                        if (index < TIME_UNITS.length - 1) {
                                            const colonElement = document.createElement('div');
                                            colonElement.classList.add('colon');
                                            colonElement.textContent = ':';
                                            timeUnitsContainer.appendChild(colonElement);
                                        }
                                    });
                                 
                                    requestAnimationFrame(calculateTimeSinceDestruction);
                                }
                                 
                                calculateTimeSinceDestruction();
                                 
                                function closePopup() {
                                    const popupContainer = document.getElementById('popup-container');
                                    if (popupContainer) {
                                        popupContainer.style.display = 'none';
                                    }
                                }
                                 
                                </script>
                                

                                241848e9-db55-4331-bbe5-d524c1d5837e-image.png ספויילר

                                ואיך אני מעלה לאתר את התמונה כלומר איפה אני מניח אותה?

                                LEVI HL תגובה 1 תגובה אחרונה
                                0
                                • T Tיו_

                                  @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                                  זה הקוד שלך:
                                  תעלה את התמונה לאתר, תעתיק את כתובת התמונה, ותכניס בקוד במקום המסומן לכך:

                                  <style>
                                  
                                  #popup-background {
                                      position: absolute;
                                      top: 0;
                                      left: 0;
                                      width: 100%;
                                      height: 100%;
                                      background-image: url('נתיב-התמונה');
                                      background-size: cover;
                                      background-position: center;
                                      mix-blend-mode: overlay;
                                      opacity: var(--overlay-opacity);
                                      z-index: 0;
                                      border-radius: 15px;
                                      filter: blur(1px);
                                  }
                                  
                                   
                                  @import url('https://fonts.googleapis.com/css2?family=Bona+Nova+SC&display=swap');
                                   
                                  :root {
                                      --background-color: #ffffff;
                                      --overlay-background: rgba(114, 42, 42, 0.5);
                                      --border-color: #444;
                                      --text-color: #ffffff;
                                      --highlight-color: #ffffff;
                                      --secondary-text-color: #bbb;
                                      --shadow-color: rgba(255, 255, 255, 0.1);
                                      --overlay-opacity: 0.5;
                                      --unit-background-color: rgba(142, 136, 136, 0.5);
                                  }
                                   
                                  body {
                                      background-color: var(--background-color);
                                      margin: 0;
                                      font-family: 'Bona Nova SC', Arial, sans-serif;
                                      color: var(--text-color);
                                  }
                                   
                                  #popup-container {
                                      position: fixed;
                                      bottom: 30px;
                                      right: 30px;
                                      background-color: var(--overlay-background);
                                      border-radius: 15px;
                                      padding: 20px;
                                      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
                                      z-index: 1000;
                                      overflow: hidden;
                                      max-width: 350px;
                                      width: auto;
                                      height: auto;
                                      box-sizing: border-box;
                                      text-align: center;
                                      transition: transform 0.3s ease, box-shadow 0.3s ease;
                                      transform: translateY(-10px);
                                  }
                                   
                                  #popup-container:hover {
                                      transform: translateY(-15px);
                                      box-shadow: 0 18px 36px rgba(0, 0, 0, 0.3);
                                  }
                                   
                                  
                                   
                                  #close-btn {
                                      position: absolute;
                                      top: 5px;
                                      left: 5px;
                                      background-color: transparent;
                                      border: none;
                                      color: var(--text-color);
                                      font-size: 16px;
                                      cursor: pointer;
                                      z-index: 2;
                                  }
                                   
                                  #temple-counter {
                                      position: relative;
                                      z-index: 1;
                                  }
                                   
                                  #temple-counter h2 {
                                      color: var(--highlight-color);
                                      font-size: 18px;
                                      margin-bottom: 10px;
                                      font-weight: 700;
                                      line-height: 1.2;
                                  }
                                   
                                  .time-unit {
                                      display: flex;
                                      justify-content: center;
                                      align-items: center;
                                      margin-bottom: 10px;
                                      flex-direction: row-reverse;
                                  }
                                   
                                  .unit {
                                      display: flex;
                                      flex-direction: column;
                                      align-items: center;
                                      margin: 0 5px;
                                  }
                                   
                                  .unit-title {
                                      font-size: 12px;
                                      color: var(--secondary-text-color);
                                      margin-top: 4px;
                                  }
                                   
                                  .unit-value-container {
                                      display: flex;
                                      flex-direction: row;
                                      justify-content: center;
                                      align-items: center;
                                  }
                                   
                                  .unit-value {
                                      display: flex;
                                      align-items: center;
                                      justify-content: center;
                                      border: none;
                                      padding: 5px;
                                      border-radius: 6px;
                                      background-color: var(--unit-background-color);
                                      font-family: 'Digital-7', Arial, sans-serif;
                                      font-size: 20px;
                                      font-weight: 700;
                                      color: var(--text-color);
                                      min-width: 20px;
                                      width: 20px;
                                      margin: 0 1px;
                                      height: 30px;
                                      line-height: 30px;
                                      text-align: center;
                                      box-sizing: border-box;
                                  }
                                   
                                  .colon {
                                      font-size: 16px;
                                      line-height: 30px;
                                      font-family: 'Digital-7', Arial, sans-serif;
                                      display: flex;
                                      align-items: center;
                                      justify-content: center;
                                      height: 30px;
                                      margin: 0 2px;
                                      position: relative;
                                      top: -8px;
                                  }
                                   
                                  .action {
                                      font-size: 14px;
                                      color: var(--highlight-color);
                                      margin-top: 10px;
                                      text-transform: uppercase;
                                      font-weight: 700;
                                  }
                                   
                                  @media (max-width: 480px) {
                                      #popup-container {
                                          width: 90vw;
                                          padding: 5px;
                                          right: 5vw;
                                      }
                                   
                                      .unit-value {
                                          font-size: 16px;
                                          height: auto;
                                      }
                                   
                                      .colon {
                                          font-size: 14px;
                                          line-height: 16px;
                                      }
                                  }
                                   
                                  </style>
                                  <script>
                                   
                                  const link = document.createElement('link');
                                  link.rel = 'stylesheet';
                                  link.href = 'style.css';
                                  document.head.appendChild(link);
                                   
                                  const popupContainer = document.createElement('div');
                                  popupContainer.id = 'popup-container';
                                   
                                  popupContainer.innerHTML = `
                                      <div id="popup-background"></div>
                                      <button id="close-btn" onclick="closePopup()" aria-label="סגור">✕</button>
                                      <div id="temple-counter">
                                          <h2>זמן שחלף מאז חורבן בית המקדש</h2>
                                          <div class="time-unit" id="time-units-container"></div>
                                          <div class="action">"והראנו בבניינו ושמחנו בתיקונו"</div>
                                      </div>
                                  `;
                                   
                                  document.body.appendChild(popupContainer);
                                   
                                   
                                  const DESTRUCTION_YEAR = 70;
                                   
                                  function getTishaBAvDate(year) {
                                      return new Date(year, 7, 12);
                                  }
                                   
                                  function calculateTimeSinceDestruction() {
                                      const today = new Date();
                                      const tishaBAvDate = getTishaBAvDate(today.getFullYear());
                                      const timeSinceDestruction = today - tishaBAvDate;
                                      const daysSinceDestruction = Math.floor(timeSinceDestruction / (1000 * 60 * 60 * 24)) - 1;
                                      const yearsSinceDestruction = today.getFullYear() - DESTRUCTION_YEAR;
                                   
                                      const times = {
                                          days: daysSinceDestruction,
                                          years: yearsSinceDestruction,
                                      };
                                   
                                      const timeUnitsContainer = document.getElementById('time-units-container');
                                      timeUnitsContainer.innerHTML = '';
                                   
                                   
                                      const TIME_UNITS = ['days', 'years'];
                                   
                                      TIME_UNITS.forEach((unit, index) => {
                                          let unitValue = times[unit].toString().padStart(2, '0');
                                   
                                          const unitContainer = document.createElement('div');
                                          unitContainer.classList.add('unit');
                                   
                                          const valueContainer = document.createElement('div');
                                          valueContainer.classList.add('unit-value-container');
                                   
                                          unitValue.split('').forEach(number => {
                                              const numberElement = document.createElement('div');
                                              numberElement.classList.add('unit-value');
                                              numberElement.textContent = number;
                                              valueContainer.appendChild(numberElement);
                                          });
                                   
                                          unitContainer.appendChild(valueContainer);
                                   
                                          const titleElement = document.createElement('div');
                                          titleElement.classList.add('unit-title');
                                          titleElement.textContent = unit === 'years' ? 'שנים' : 'ימים';
                                   
                                          unitContainer.appendChild(titleElement);
                                          timeUnitsContainer.appendChild(unitContainer);
                                   
                                          if (index < TIME_UNITS.length - 1) {
                                              const colonElement = document.createElement('div');
                                              colonElement.classList.add('colon');
                                              colonElement.textContent = ':';
                                              timeUnitsContainer.appendChild(colonElement);
                                          }
                                      });
                                   
                                      requestAnimationFrame(calculateTimeSinceDestruction);
                                  }
                                   
                                  calculateTimeSinceDestruction();
                                   
                                  function closePopup() {
                                      const popupContainer = document.getElementById('popup-container');
                                      if (popupContainer) {
                                          popupContainer.style.display = 'none';
                                      }
                                  }
                                   
                                  </script>
                                  

                                  241848e9-db55-4331-bbe5-d524c1d5837e-image.png ספויילר

                                  ואיך אני מעלה לאתר את התמונה כלומר איפה אני מניח אותה?

                                  LEVI HL מנותק
                                  LEVI HL מנותק
                                  LEVI H
                                  מדריכים
                                  כתב נערך לאחרונה על ידי
                                  #59

                                  @Tיו_ איפה שאתה רוצה, אתה יכול להוסיף אותה לאתר בכל מקום.
                                  העיקר שהיא תעלה לאתר, ותעתיק את הכתובת שלה.
                                  לחילופים תוכל לנסות להדביק את הקישור ישר מגיטאב:
                                  https://moshelavi.github.io/beit-amikdash/beit amikdash script/בית המקדש.jpg

                                  T תגובה 1 תגובה אחרונה
                                  1
                                  • LEVI HL LEVI H

                                    @Tיו_ איפה שאתה רוצה, אתה יכול להוסיף אותה לאתר בכל מקום.
                                    העיקר שהיא תעלה לאתר, ותעתיק את הכתובת שלה.
                                    לחילופים תוכל לנסות להדביק את הקישור ישר מגיטאב:
                                    https://moshelavi.github.io/beit-amikdash/beit amikdash script/בית המקדש.jpg

                                    T מנותק
                                    T מנותק
                                    Tיו_
                                    כתב נערך לאחרונה על ידי
                                    #60

                                    @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                                    @Tיו_ איפה שאתה רוצה, אתה יכול להוסיף אותה לאתר בכל מקום.
                                    העיקר שהיא תעלה לאתר, ותעתיק את הכתובת שלה.
                                    לחילופים תוכל לנסות להדביק את הקישור ישר מגיטאב:
                                    https://moshelavi.github.io/beit-amikdash/beit amikdash script/בית המקדש.jpg

                                    עובד יישר כח אלוףףף
                                    ee3b9e55-7548-400b-934b-f83421d21f1d-image.png

                                    LEVI HL צ ט 3 תגובות תגובה אחרונה
                                    2
                                    • T Tיו_

                                      @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                                      @Tיו_ איפה שאתה רוצה, אתה יכול להוסיף אותה לאתר בכל מקום.
                                      העיקר שהיא תעלה לאתר, ותעתיק את הכתובת שלה.
                                      לחילופים תוכל לנסות להדביק את הקישור ישר מגיטאב:
                                      https://moshelavi.github.io/beit-amikdash/beit amikdash script/בית המקדש.jpg

                                      עובד יישר כח אלוףףף
                                      ee3b9e55-7548-400b-934b-f83421d21f1d-image.png

                                      LEVI HL מנותק
                                      LEVI HL מנותק
                                      LEVI H
                                      מדריכים
                                      כתב נערך לאחרונה על ידי
                                      #61

                                      @Tיו_ מעולה.

                                      תגובה 1 תגובה אחרונה
                                      0
                                      • T Tיו_

                                        @LEVI-H כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                                        @Tיו_ איפה שאתה רוצה, אתה יכול להוסיף אותה לאתר בכל מקום.
                                        העיקר שהיא תעלה לאתר, ותעתיק את הכתובת שלה.
                                        לחילופים תוכל לנסות להדביק את הקישור ישר מגיטאב:
                                        https://moshelavi.github.io/beit-amikdash/beit amikdash script/בית המקדש.jpg

                                        עובד יישר כח אלוףףף
                                        ee3b9e55-7548-400b-934b-f83421d21f1d-image.png

                                        צ מנותק
                                        צ מנותק
                                        צבי דורש ציון
                                        כתב נערך לאחרונה על ידי צבי דורש ציון
                                        #62

                                        @Tיו_

                                        מותר לבקש לראות את זה באתר?
                                        אתה כמובן לא חייב... אבל אשמח לקישור

                                        T תגובה 1 תגובה אחרונה
                                        0
                                        • צ צבי דורש ציון

                                          @Tיו_

                                          מותר לבקש לראות את זה באתר?
                                          אתה כמובן לא חייב... אבל אשמח לקישור

                                          T מנותק
                                          T מנותק
                                          Tיו_
                                          כתב נערך לאחרונה על ידי
                                          #63

                                          @צבי-דורש-ציון כתב בשיתוף | פופאפ לזכרון בית המקדש - לבעלי אתרים:

                                          @Tיו_

                                          מותר לבקש לראות את זה באתר?
                                          אתה כמובן לא חייב... אבל אשמח לקישור

                                          WWW.החנותשלרכסים.COM
                                          אם זה נוגד את חוקי הפורום אני ימחק

                                          האתר לא עובד עדיין בשורות טובות לרכסים בקרוב😁

                                          צ תגובה 1 תגובה אחרונה
                                          3

                                          • התחברות

                                          • אין לך חשבון עדיין? הרשמה

                                          • התחברו או הירשמו כדי לחפש.
                                          • פוסט ראשון
                                            פוסט אחרון
                                          0
                                          • חוקי הפורום
                                          • פופולרי
                                          • לא נפתר
                                          • משתמשים
                                          • חיפוש גוגל בפורום
                                          • צור קשר