Bootstrap 4 Carousel jak na linkování URL z jiné stránky?

8. 11. 2018 16:26:50

Ahoj nevěděl byste někdo náhodou jak správně nalinkovat odkazy na daný slajd ?

Mám stránku s odkazem www.example.com/#carousel2

Našel jsem a vytvořil jsem něco takového:

Do konzole log to napíše po kliknutí na menu...správně to co k čemu patří, ale správnej slajd se mi nezobrazí, pořád jen ten první....

$(".carousel-item:nth-child(1)").attr("id", "carousel1");
      $(".carousel-item:nth-child(2)").attr("id", "carousel2");
       $(".carousel-item:nth-child(3)").attr("id", "carousel3");
         $(".carousel-item:nth-child(4)").attr("id", "carousel4");

jQuery.when(jQuery(".carousel").carousel({ interval: 5000 })).done( function() {
   if(window.location.hash) {
              var home_section = window.location.hash.substring(1);
            console.log(home_section);
            if (home_section == "carousel1") { 
            
            goToSlide(0); 
            console.log("went to auto");
            
          }
          
            if (home_section == "carousel2") { goToSlide(1); console.log("went to home"); } 
            if (home_section == "carousel3") { goToSlide(2); console.log("went to business");}
             if (home_section == "carousel4") { goToSlide(3); console.log("went to business");}
          }
          
          
          
        });

function goToSlide(number) {
   jQuery(".carousel").carousel(number);
}  
           
 });

Nemáte někdo zkušenost pls ?

Položky menu:

A slajd:

<div id="carouselExampleControls" class="carousel slide carousel-fade" data-ride="carousel">
           
           
             
  <ul class="carousel-indicators rounded">
    <li data-target="#carouselExampleControls" data-slide-to="0" class="active"></li>
    <li data-target="#carouselExampleControls" data-slide-to="1"></li>
    <li data-target="#carouselExampleControls" data-slide-to="2"></li>
    <li data-target="#carouselExampleControls" data-slide-to="3"></li>
  </ul>
           
           
            <div class="carousel-inner"> 
           <?php
            $sql = "SELECT * FROM directory WHERE status = 'P' ORDER BY postid ASC ";
            $result = $DB->prepare($sql);  
            $result->execute();    
            // Zobrazenie slideov 
            while ($rs = $result->fetch(PDO::FETCH_ASSOC)) { ?>

<div class="carousel-item"   style="background-image:url('/css/img/obrazky/<?php echo stripslashes($rs); ?>'" >
         
           <div class="directory-view <?php echo ($rs); ?>">
                <h2 class="directory-heading"><a href="<?php echo ($rs); ?>"><?php echo stripslashes($rs); ?></a></h2>
                <br>
                <span class="directory-button"><a href="<?php echo ($rs); ?>"><?php echo stripslashes($rs); ?></a></span>
                <br>
            </div>
       
      <div class="directory-view <?php echo ($rs); ?>">
                <h2 class="directory-heading"><a href="<?php echo ($rs); ?>"><?php echo stripslashes($rs); ?></a></h2>
                <br>
                <span class="directory-button"><a href="<?php echo ($rs); ?>"><?php echo stripslashes($rs); ?></a></span>
                <br>
            </div>  
       
     
      
      
         
  <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
      
      </div>
      
        
      
      
     <?php
    };
    
    
    ?>   
      
    </div>
    </div>

8. 11. 2018 16:26:50