swilson1337/yii2-popover-x

一个扩展的 Bootstrap 3.0 Popover 小部件,结合了 Bootstrap Popover 和 Modal 特性,并包含各种新的样式增强。

安装次数: 135

依赖项: 0

建议者: 0

安全: 0

星标: 0

关注者: 1

分支: 8

类型:yii2-extension

v1.3.7 2019-01-08 06:05 UTC

This package is auto-updated.

Last update: 2024-09-08 18:54:56 UTC


README

Krajee Logo
yii2-popover-x Donate

Stable Version Untable Version License Total Downloads Monthly Downloads Daily Downloads

基于 Krajee 的 bootstrap-popover-x jQuery 插件 的 Yii Framework 2 扩展 Popover 小部件。此插件是一个扩展的 Popover jQuery 插件,结合了 Popover 和 Bootstrap Modal 特性,并包含各种新的样式增强。此小部件可以像内置的 yii\bootstrap\Modal 一样设置,还有一些额外的增强。

注意:有关各种版本更改的详细信息,请参阅 变更日志

特性

插件提供以下增强特性:

  • 扩展的 Popover 可以像 Bootstrap Modal 对话框一样渲染,具有 Bootstrap Popover 样式。由于插件扩展了 Bootstrap Modal,因此 bootstrap modal 的所有特性和方法也都可用。
  • 添加了 Popover 页脚,包括标题。配置 Popover 的 HTML 内容就像 Bootstrap Modal 一样简单。
  • 专门为 Popover 页脚中添加的 Bootstrap 按钮设置了样式和间距。
  • 向 Popover 窗口中添加关闭图标/按钮。
  • 配置各种预构建样式/模板。除了默认的(灰色)外,还可以使用 Bootstrap 3 的上下文颜色样式 primaryinfosuccessdangerwarning
  • 根据目标元素控制 Popover 位置。插件支持 19 种不同的位置选项
    • auto
    • auto-left
    • auto-right
    • auto-top
    • auto-bottom
    • horizontal
    • vertical
    • right
    • left
    • top
    • bottom
    • top top-left
    • top top-right
    • bottom bottom-left
    • bottom bottom-right
    • left left-top
    • left left-bottom
    • right right-top
    • right right-bottom
  • 特别为每个上下文颜色和 Popover 位置设计 Popover 箭头样式,使其保持一致。
  • 预构建 CSS 样式,用于控制 Popover 的外观和大小。

注意:此扩展依赖于 kartik-v/yii2-widgets 扩展,而后者又依赖于 yiisoft/yii2-bootstrap 扩展。请检查 composer.json 以了解此扩展的要求和依赖关系。注意:Yii 2 框架仍在积极开发中,在完全稳定的 Yii2 发布之前,您的核心 yii2-bootstrap 包(及其依赖项)在安装或更新此扩展时可能会更新。如果您不想自动更新依赖项,您可能需要锁定特定应用程序的 composer 包版本,并测试扩展是否中断。

演示

您可以在 此处 查看有关扩展使用的详细文档和示例。

安装

安装此扩展的首选方法是使用 composer

注意:检查此扩展的需求和依赖项,请参阅composer.json。阅读有关为您的应用程序的composer.json设置minimum-stability设置的web提示/wiki

运行以下命令之一:

$ php composer.phar require kartik-v/yii2-popover-x "dev-master"

或者将以下内容添加到您的composer.json文件的require部分:

"kartik-v/yii2-popover-x": "dev-master"

用法

PopoverX

use kartik\popover\PopoverX;

PopoverX::begin([
    'header' => 'Hello world',
    'footer' => Html::button('View', ['class'=>'btn btn-primary']),
    'toggleButton' => ['class'=>'btn btn-primary'],
]);

echo '<p class="text-justify">' .
    'Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.' . 
    '</p>';

PopoverX::end();

许可证

yii2-popover-x在BSD 3-Clause许可证下发布。有关详细信息,请参阅附带文件LICENSE.md