Last active
March 27, 2022 04:55
-
-
Save ryumada/b9b37571b04abbad5c7fe47f86417614 to your computer and use it in GitHub Desktop.
bootstrap carousel on svg frame. using php base_url to locate image.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <svg class="banner-pengumuman" width="305" height="277" viewBox="0 0 305 277" fill="none" xmlns="http://www.w3.org/2000/svg"> | |
| <clippath id="cp-circle"> | |
| <path d="M0 2.11911C0 2.11911 181.059 -18.0491 255.238 66.0531C329.417 150.155 298.694 278 298.694 278H0V2.11911Z" fill="url(#pattern1)" /> | |
| </clippath> | |
| <g clip-path="url(#cp-circle)"> | |
| <foreignObject width="848" x="0" y="0" height="477"> | |
| <body xmlns="http://www.w3.org/1999/xhtml"> | |
| <!-- <iframe width="848" height="477" src="//www.examples.com" frameborder="0" allowfullscreen></iframe> --> | |
| <div style="width: 36.30%;" id="carouselExampleIndicators" class="carousel slide carousel-fade" data-ride="carousel"> | |
| <ol class="carousel-indicators"> | |
| <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li> | |
| <li data-target="#carouselExampleIndicators" data-slide-to="1"></li> | |
| <!-- <li data-target="#carouselExampleIndicators" data-slide-to="2"></li> --> | |
| </ol> | |
| <div class="carousel-inner"> | |
| <div class="carousel-item active"> | |
| <!-- <img class="d-block w-100" src="https://picsum.photos/1000/900" alt="First slide"> --> | |
| <img class="d-block w-100" src="<?= base_url('assets/'); ?>img/pengumuman/1.jpg" alt="First slide"> | |
| <div class="carousel-caption d-none d-md-block"> | |
| <!-- <h5>Judul Pengumuman</h5> | |
| <p>Text Pengumuman</p> --> | |
| </div> | |
| </div> | |
| <div class="carousel-item"> | |
| <img class="d-block w-100" src="<?= base_url('assets/'); ?>img/pengumuman/2.jpg" alt="Second slide"> | |
| <div class="carousel-caption d-none d-md-block"> | |
| <!-- <h5>Judul Pengumuman</h5> | |
| <p>Text Pengumuman</p> --> | |
| </div> | |
| </div> | |
| <!-- <div class="carousel-item"> | |
| <img class="d-block w-100" src="<?= base_url('assets/'); ?>img/pengumuman/3.jpg" alt="Third slide"> | |
| <div class="carousel-caption d-none d-md-block"> | |
| <h5>Judul Pengumuman</h5> | |
| <p>Text Pengumuman</p> | |
| </div> | |
| </div> --> | |
| </div> | |
| </div> | |
| </body> | |
| </foreignObject> | |
| </g> | |
| </svg> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
this error is because I'm using PHP tag in
srcattribute. You should download it to try it in your environment.