Я не могу получить текст для показа на этом слайдере цитат - PullRequest
Новая
       5

Я не могу получить текст для показа на этом слайдере цитат

0 голосов
/ 15 января 2020

Ползунок кавычек, кажется, не загружает текст, кнопки и точки есть, но реальные цитаты в центре не отображаются внутри них, есть просто набор точек и кнопок, аккуратно помещенных в центре экран, где цитаты должны быть. Как сделать так, чтобы внутри кнопок ползунка отображались кавычки HTML

            <div class="testimonials">
        <div class="slideshow-container">
            <div class="mySlides">
                <q>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores, vel?</q>
                <p class="author">Name Name</p>
            </div>
            <div class="mySlides">
                <q>Quibusdam adipisci ab explicabo. Porro exercitationem delectus nam unde corporis.</q>
                <p class="author">Name Name</p>
            </div>
            <div class="mySlides">
                <q>Beatae saepe ab sed, nihil perferendis et, pariatur dolores! Vel.</q>
                <p class="author">Name Name</p>
            </div>
            <a class="prev" onclick='plusSlides(-1)'>&#10094;</a>
            <a class="next" onclick='plusSlides(1)'>&#10095;</a>
        </div>
        <div class="dot-container">
            <span class="dot" onclick='currentSlide(1)'></span>
            <span class="dot" onclick='currentSlide(2)'></span>
            <span class="dot" onclick='currentSlide(3)'></span>
        </div>
        </div>

CSS

    .testimonials {
        height: 800px;
    }

    .slideshow-container {
        position: relative;
        background: #f1f1f1;
    }

    .mySlides {
        display: none;
        padding: 80px;
        text-align: center;
     }

    .prev, .next {
        cursor: pointer;
        position: absolute;
        top: 50%;
        width: auto;
        margin-top: -30px;
        padding:16px;
         color: #888;
        font-weight: bold;
        font-size: 20px;
        border-radius: 0 3px 30px 0;
        user-select: none;
    }

    .next {
        position: absolte;
        right: 0;
        border-radius: 3px 0 0 3px;
     }

     .prev:hover, .next:hover {
          background-color: rgba(0,0,0,0.8);
          color:white;
     }

      .dot-container {
           text-align: center;
          padding: 20px;
         background: #ddd;
    }

    .dot {
         cursor: pointer;
         height: 15px;
         width: 15px;
         margin: 0 2px;
         background: #bbb;
         border-radius: 50%;
         display: inline-block;
         transition: background-color 0.6s ease;
     }

.active, .dot:hover {
    background: #717171;
}

q {
    color: #1c1c1c;
    font-style: italic;
}

.authour {
    color: aqua;
}
...