Free news pop up script

Here is a simple free news popup script that you can use on your website:

HTML:

<!-- The popup container -->
<div id="news-popup" style="display:none;">
  <h2>Breaking News!</h2>
  <p id="news-text"></p>
  <button id="close-btn">Close</button>
</div>

<!-- The script will add this button to the page -->
<button id="news-btn">Get Breaking News!</button>

JavaScript:

// Get the popup container and button elements
var popup = document.getElementById('news-popup');
var btn = document.getElementById('news-btn');
var closeBtn = document.getElementById('close-btn');
var newsText = document.getElementById('news-text');

// Function to display the popup with a random news headline
function showNews() {
  // Get a random news headline from an API or a local array
  var news = ['Breaking: New Study Reveals...', 'Top 5 Ways to...', 'Latest Update on...'];
  var randomNews = news[Math.floor(Math.random() * news.length)];

  // Display the popup with the random news headline
  popup.style.display = 'block';
  newsText.textContent = randomNews;
}

// Function to close the popup
function closePopup() {
  popup.style.display = 'none';
}

// Add event listeners to the button and close button
btn.addEventListener('click', showNews);
closeBtn.addEventListener('click', closePopup);

How it works:

  1. The script gets the popup container, button, and close button elements using document.getElementById.
  2. The showNews function is called when the button is clicked. It gets a random news headline from an API or a local array and displays the popup with the headline.
  3. The closePopup function is called when the close button is clicked. It hides the popup.
  4. The script adds event listeners to the button and close button to trigger the showNews and closePopup functions respectively.

Note: