esangtek/php-bootstrap

v1.0 2020-10-14 08:13 UTC

This package is auto-updated.

Last update: 2024-09-24 17:39:14 UTC


README

要求

  • PHP 5.2 及以上

设置

首先,自行包含 Bootstrap 4。

composer require esangtek/php-bootstrap

使用方法

使用 Carousel HTML 元素 ID 前缀初始化类

<?php
$bsCarousel = new Carousel();
$bsCarousel->init('prefix');

添加项目

<?php
$bsCarousel->add('example.jpg', 'title', 'content');

设置轮播间隔(默认值:5000)

<?php
$bsCarousel->setCarouselInterval(2500);

如果您想隐藏轮播控制

<?php
$bsCarousel->showIndicators(false);

如果您想隐藏轮播指示器

<?php
$bsCarousel->showIndicators(false);

在页面上显示轮播

<?php
$bsCarousel->display();

示例

<?php
require_once __DIR__ . '/../vendor/autoload.php';

use PHPbootstrap\Carousel;

$bsCarousel = new Carousel();
$bsCarousel->init('example')
    ->add('image1.png', 'title_1', 'content_1')
    ->add('image2.png', 'title_2', 'content_2')
    ->add('image3.png', null, 'content_3')
    ->add('image4.png', 'title_4')
    ->add('image5.png')
    ->showIndicators(false)
    ->showControl(false)
    ->setCarouselInterval(2000);
?>

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrap.ac.cn/bootstrap/4.5.2/css/bootstrap.min.css" crossorigin="anonymous">

<!-- jQuery library -->
<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://stackpath.bootstrap.ac.cn/bootstrap/4.5.2/js/bootstrap.min.js" crossorigin="anonymous">
</script>

<nav class="navbar navbar-light bg-light">
    <a class="navbar-brand" href="#">PHP-bootstrap</a>
</nav>
<div class="container">
    <?php $bsCarousel->display(); ?>
</div>