Home – Page 2 – THE ALERT INDIA

Saudi Arabia’s Economic Transformation Faces Key Test Amid Lower Oil Prices: IMF

December 21, 2025December 21, 2025

Income Tax Department Raids Shilpa Shetty’s Mumbai Residence in ₹60-Crore Fraud Probe

December 18, 2025December 18, 2025

IN Bondi Beach Gunman Identified as Hyderabad Native; Indian Police Rule Out Local Radicalisation: The Alert India.

December 16, 2025December 16, 2025

India’s Exports Rise 15.5% in November 2025 as Services and Engineering Goods Drive Trade Growth

December 16, 2025December 17, 2025

The Silent Crisis: Academic Pressure on Students and Parents in India

December 10, 2025December 10, 2025

Scindia, Starlink Officials Discuss Satellite Internet Expansion to India’s Remote Corners

December 10, 2025December 10, 2025

Haryana Police Intensifies Crackdown with Major Operations: DGP O.P. Singh Briefs on Anti-Crime Strategies

December 10, 2025December 10, 2025

Big Breaking National

Indian Army Successfully Executes Combat Launch of BrahMos Supersonic Cruise Missile

December 3, 2025December 4, 2025

Neeraj Gaur

Big Breaking National

Centre Softens Stance on Sanchar Saathi App Amid Lok Sabha Privacy Row: The Alert India

December 3, 2025December 4, 2025

Neeraj Gaur

Big Breaking World

Major War, Possibly Nuclear, Is Coming Within 5 or Max 10 Years: The Alert India

December 2, 2025December 4, 2025

Hari Kaushik

Big Breaking National

Narendra Modi’s remarks on “drama”Parliament witnessed heated exchanges. The Alert India.

December 1, 2025December 4, 2025

Neeraj Gaur

Big Breaking Law

TRANSFER OF PROPERTY ACT: Property Transferred prior to filling of suit can’t be attached Under Order 38 Rule 5 CPC: SUPREME COURT. NEERAJ GAUR.

December 1, 2025December 4, 2025

Neeraj Gaur

Big Breaking Editorial

RAJYA SABHA “THE BACK DOOR ENTRY” IN INDIAN POLITICS: NEERAJ GAUR

November 30, 2025December 4, 2025

Neeraj Gaur

Big Breaking Sports

India vs Bangladesh: Rishabh Pant equals MS Dhoni’s record with 6th Test hundred

November 28, 2025December 4, 2025

Neeraj Gaur

Big Breaking Entertainment

Injured Shilpa Shetty to be back on her feet soon, says ‘I am getting better’

November 28, 2025December 4, 2025

Neeraj Gaur

Big Breaking Law

Justice V Srishananda Of Karnataka High Court Expresses Regret For Objectionable Remarks: Neeraj Gaur

November 27, 2025December 4, 2025

Neeraj Gaur

Big Breaking Metropolitan Cities

Delhi pollution: US Embassy to buy 1200 boxes of True HEPA air purifier filters ASAP

November 27, 2025December 4, 2025

Hari Kaushik

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>Big Breaking Carousel</title>

  <!-- Optional: Roboto Condensed from Google Fonts -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&display=swap" rel="stylesheet">

  <style>
    /* === BIG BREAKING CUSTOM CAROUSEL === */

    body {
      margin: 0;
      font-family: 'Roboto Condensed', sans-serif;
      background: #f5f5f5;
    }

    .ta-bigbreaking-carousel {
      max-width: 1200px;
      margin: 40px auto;
      padding: 0 16px;
      font-family: 'Roboto Condensed', sans-serif;
    }

    /* Heading style */
    .ta-carousel-header h2 {
      font-size: 28px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 1px;
      color: #e11b22;
      margin: 0 0 16px;
      position: relative;
      display: inline-block;
    }

    .ta-carousel-header h2::before,
    .ta-carousel-header h2::after {
      content: "";
      position: absolute;
      top: 50%;
      width: 60px;
      height: 2px;
      background: #000;
      transform: translateY(-50%);
    }

    .ta-carousel-header h2::before {
      left: -80px;
    }

    .ta-carousel-header h2::after {
      right: -80px;
    }

    /* Viewport */
    .ta-carousel-viewport {
      overflow: hidden;
      border-radius: 6px;
    }

    /* Track */
    .ta-carousel-track {
      display: flex;
      transition: transform 0.5s ease-in-out;
    }

    /* Each slide: 1 at a time */
    .ta-slide {
      flex: 0 0 100%;
      display: flex;
      flex-direction: column;
      background: #000;
      color: #fff;
    }

    /* Banner height (change for smaller/larger) */
    .ta-slide-image img {
      width: 100%;
      height: 340px;   /* make 320/300 if you want it shorter */
      object-fit: cover;
      display: block;
    }

    .ta-slide-content {
      padding: 16px 20px 20px;
      background: #000;
    }

    .ta-slide-category {
      display: inline-block;
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      background: #e11b22;
      padding: 3px 8px;
      margin-bottom: 8px;
      border-radius: 2px;
    }

    .ta-slide-title {
      font-size: 20px;
      line-height: 1.3;
      margin: 4px 0 6px;
    }

    .ta-slide-title a {
      color: #fff;
      text-decoration: none;
    }

    .ta-slide-title a:hover {
      text-decoration: underline;
    }

    .ta-slide-meta {
      font-size: 13px;
      color: #ccc;
    }

    /* Controls */
    .ta-carousel-controls {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      margin-top: 10px;
    }

    .ta-prev,
    .ta-next {
      border: none;
      background: #111;
      color: #fff;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      cursor: pointer;
      font-size: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .ta-prev:hover,
    .ta-next:hover {
      background: #e11b22;
    }

    /* Dots */
    .ta-dots {
      display: flex;
      gap: 6px;
    }

    .ta-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      border: none;
      background: #ccc;
      cursor: pointer;
    }

    .ta-dot.is-active {
      background: #e11b22;
    }

    /* Responsive */
    @media (max-width: 768px) {
      .ta-slide-image img {
        height: 260px;
      }
      .ta-slide-title {
        font-size: 18px;
      }
    }
  </style>
</head>
<body>

  <!-- ===== BIG BREAKING CAROUSEL ===== -->
  <section class="ta-bigbreaking-carousel" aria-label="Big Breaking">
    <div class="ta-carousel-header">
      <h2>BIG BREAKING</h2>
    </div>

    <div class="ta-carousel-viewport">
      <div class="ta-carousel-track">

        <!-- SLIDE 1 -->
        <article class="ta-slide is-active">
          <a href="#" class="ta-slide-image">
            <img src="https://picsum.photos/1200/700?random=1" alt="Headline 1">
          </a>
          <div class="ta-slide-content">
            <span class="ta-slide-category">BIG BREAKING</span>
            <h3 class="ta-slide-title">
              <a href="#">
                ED conducts raids across 10 states in medical college bribery case
              </a>
            </h3>
            <div class="ta-slide-meta">November 27, 2025 • New Delhi</div>
          </div>
        </article>

        <!-- SLIDE 2 -->
        <article class="ta-slide">
          <a href="#" class="ta-slide-image">
            <img src="https://picsum.photos/1200/700?random=2" alt="Headline 2">
          </a>
          <div class="ta-slide-content">
            <span class="ta-slide-category">BIG BREAKING</span>
            <h3 class="ta-slide-title">
              <a href="#">
                India vs Bangladesh: Rishabh Pant equals MS Dhoni’s record
              </a>
            </h3>
            <div class="ta-slide-meta">November 28, 2025 • Sports Desk</div>
          </div>
        </article>

        <!-- SLIDE 3 -->
        <article class="ta-slide">
          <a href="#" class="ta-slide-image">
            <img src="https://picsum.photos/1200/700?random=3" alt="Headline 3">
          </a>
          <div class="ta-slide-content">
            <span class="ta-slide-category">BIG BREAKING</span>
            <h3 class="ta-slide-title">
              <a href="#">
                Justice V Srishananda of Karnataka HC expresses regret for remarks
              </a>
            </h3>
            <div class="ta-slide-meta">November 27, 2025 • Bengaluru</div>
          </div>
        </article>

        <!-- Add more <article class="ta-slide"> ... </article> for more news -->

      </div>
    </div>

    <div class="ta-carousel-controls">
      <button class="ta-prev" type="button" aria-label="Previous">&#10094;</button>
      <div class="ta-dots"></div>
      <button class="ta-next" type="button" aria-label="Next">&#10095;</button>
    </div>
  </section>

  <script>
    // Simple vanilla JS slider: 1 slide at a time, auto every 2s
    document.addEventListener('DOMContentLoaded', function () {
      const root = document.querySelector('.ta-bigbreaking-carousel');
      if (!root) return;

      const track = root.querySelector('.ta-carousel-track');
      const slides = Array.from(root.querySelectorAll('.ta-slide'));
      const prevBtn = root.querySelector('.ta-prev');
      const nextBtn = root.querySelector('.ta-next');
      const dotsContainer = root.querySelector('.ta-dots');

      let index = 0;
      let timer;
      const slideCount = slides.length;
      if (!slideCount) return;

      // Create dots
      slides.forEach(function (slide, i) {
        const dot = document.createElement('button');
        dot.className = 'ta-dot' + (i === 0 ? ' is-active' : '');
        dot.type = 'button';
        dot.setAttribute('aria-label', 'Go to slide ' + (i + 1));
        dot.addEventListener('click', function () {
          goToSlide(i, true);
        });
        dotsContainer.appendChild(dot);
      });

      const dots = Array.from(root.querySelectorAll('.ta-dot'));

      function goToSlide(i, stopAuto) {
        index = (i + slideCount) % slideCount;
        const offset = -index * 100;
        track.style.transform = 'translateX(' + offset + '%)';
        slides.forEach(function (s, j) {
          s.classList.toggle('is-active', j === index);
        });
        dots.forEach(function (d, j) {
          d.classList.toggle('is-active', j === index);
        });
        if (stopAuto) restartAuto();
      }

      function next() {
        goToSlide(index + 1);
      }

      function prev() {
        goToSlide(index - 1, true);
      }

      function startAuto() {
        timer = setInterval(next, 2000); // 2 seconds
      }

      function stopAuto() {
        clearInterval(timer);
      }

      function restartAuto() {
        stopAuto();
        startAuto();
      }

      if (nextBtn) nextBtn.addEventListener('click', function () {
        goToSlide(index + 1, true);
      });

      if (prevBtn) prevBtn.addEventListener('click', function () {
        goToSlide(index - 1, true);
      });

      root.addEventListener('mouseenter', stopAuto);
      root.addEventListener('mouseleave', startAuto);

      // init
      track.style.transform = 'translateX(0%)';
      startAuto();
    });
  </script>
</body>
</html>