Popup promo

/* Stili base del popup */ #popup { width: 600px; max-width: 90%; height: 500px; max-height: 90%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; border: 1px solid #ccc; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); display: none; z-index: 1000; overflow: auto; }

/* Ombreggiatura in basso a destra */ #popup::after { content: ''; position: absolute; bottom: -10px; right: -10px; width: 20px; height: 20px; background: rgba(0, 0, 0, 0.1); filter: blur(5px); }

/* Titolo lampeggiante */ #popup h2 { margin-top: 20px; text-align: center; font-weight: bold; color: blue; font-size: 18px; animation: blink 1s infinite; }

/* Sfondo del titolo */ #popup .content { padding: 20px; background-image: url('https://www.trendynet.it/wp-content/uploads/2025/01/logo-trasparente-per-penna-e-sito.png'); background-size: 150px; background-repeat: no-repeat; background-position: center top 120px; position: relative; }

/* Stili dell'elenco a cascata */ #popup select { display: block; margin: 120px auto 5px auto; padding: 10px; width: 80%; max-width: 300px; font-size: 16px; }

/* Stili dei pulsanti */ #openPage, #closePopup { display: block; margin: 10px auto; padding: 10px 20px; font-size: 16px; cursor: pointer; }

/* Effetto lampeggiante */ @keyframes blink { 50% { opacity: 0; } }

const pages = { attivita: [ { name: 'NEWS ULTIMORA', url: 'https://www.trendynet.it/articoli-news-ultimora-e-informazioni/' }, { name: 'METEO INTERATTIVO', url: 'https://www.trendynet.it/il-meteo-flash-interattivo/' }, { name: 'LIVE WEBCAM', url: 'https://www.trendynet.it/trendynet/' }, { name: 'NECROLOGI E TRIGESIMI', url: 'https://www.trendynet.it/necrologi-trigesimi/' }, { name: 'CALCOLO TEMPO E DIFFERENZA FRA DATE', url: 'https://www.trendynet.it/calcolo-tempo-e-differenza-tra-date/' }, { name: 'CONVERTI CRIPTOVALUTE', url: 'https://coinmarketcap.com/it/converter/' }, { name: 'GENERA QR E LABEL', url: 'https://qrcode.tec-it.com/it' } ], intrattenimento: [ { name: 'DISEGNI DA COLORARE E GIOCHI PER BAMBINI', url: 'https://www.trendynet.it/disegni-da-colorare-gratis-per-bambini/' }, { name: 'ENIGMISTICA', url: 'https://www.trendynet.it/attivita/enigmistica/' }, { name: 'GIOCHI FREE', url: 'https://www.trendynet.it/giochi-su-trendynet/' }, { name: 'MUSICA', url: 'https://www.trendynet.it/seleziona_musica/' } ], shopping: [ { name: 'SHOP ONLINE', url: 'https://www.trendynet.it/shop-online/' } ], viaggi: [ { name: 'BIGLIETTI AEREI', url: 'https://www.trendynet.it/attivita/biglietti-aerei/' }, { name: 'BIGLIETTI NAVI', url: 'https://www.trendynet.it/attivita/biglietti-navi/' }, { name: 'BIGLIETTI PULLMAN', url: 'https://www.trendynet.it/biglietti-pullman/' }, { name: 'BIGLIETTI TRENI', url: 'https://www.trendynet.it/attivita/biglietti-treni/' }, { name: 'CROCIERE', url: 'https://www.trendynet.it/attivita/crociere/' }, { name: 'GUIDE TURISTICHE PALERMO', url: 'https://www.guidepalermo.it/' }, { name: 'PRENOTA HOTEL E B&B', url: 'https://www.trendynet.it/attivita/prenota-hotel/' } ] };

function showPopup() { document.getElementById('popup').style.display = 'block'; }

function closePopup() { document.getElementById('popup').style.display = 'none'; }

function populatePages(select) { const category = select.value; const pagesSelect = document.getElementById('pages'); const openPageButton = document.getElementById('openPage');

if (category) { pagesSelect.innerHTML = `Seleziona una pagina`; pages[category].forEach(page => { pagesSelect.innerHTML += `${page.name}`; }); pagesSelect.style.display = 'block'; openPageButton.style.display = 'block';

// Se la categoria "SHOPPING ONLINE" ha un solo link, reindirizza direttamente if (category === 'shopping' && pages[category].length === 1) { window.open(pages[category][0].url, '_blank'); closePopup(); } } else { pagesSelect.style.display = 'none'; openPageButton.style.display = 'none'; } }

function openSelectedPage() { const pagesSelect = document.getElementById('pages'); const selectedPageUrl = pagesSelect.value; if (selectedPageUrl) { window.open(selectedPageUrl, '_blank'); closePopup(); } }

// Mostra il popup all'apertura del sito window.onload = showPopup;

// Mostra il popup ogni 10 minuti setInterval(showPopup, 10 * 60 * 1000);