README

安装指南

$ php composer.phar require grozzzny/depends "dev-master"

或

$ composer require grozzzny/depends "dev-master"

或 composer.json

"require": {
  "grozzzny/depends": "dev-master"
}

文件 AppAsset.php

class AppAsset extends \yii\web\AssetBundle
{
    ..
    public $depends = [
    	'grozzzny\depends\glyphicon\GlyphiconAsset',
        'grozzzny\depends\bootstrap4\Bootstrap4Asset',
        'grozzzny\depends\bootstrap4\Bootstrap4PluginAsset',
        'grozzzny\depends\mdbootstrap\MDBootstrapAsset',
        'grozzzny\depends\mdbootstrap\MDBootstrapPluginAsset',
        'grozzzny\depends\checkbox_theme\CheckboxThemeAsset',
        'grozzzny\depends\responsive_tables\ResponsiveTablesAsset',
        'grozzzny\depends\froala\FroalaAsset',
        'grozzzny\depends\jssocials\JssocialsAsset',
        'grozzzny\depends\morris\MorrisAsset',
		'grozzzny\depends\highlight\HighlightAsset',
        'grozzzny\depends\waves\WavesAsset',
        'grozzzny\depends\cropper\CropperAsset',
		'grozzzny\depends\jarallax\JarallaxAsset',
        'grozzzny\depends\fontawesome5\FontAwesome5Asset',
        'grozzzny\depends\popper\PopperAsset',
        'grozzzny\depends\tether\TetherAsset',
        'grozzzny\depends\bxslider\BxsliderAsset',
        'grozzzny\depends\flexslider\FlexsliderAsset',
        'grozzzny\depends\font_awesome\FontAwesomeAsset',
        'grozzzny\depends\jquery_migrate\JqueryMigrateAsset',
        'grozzzny\depends\jquery_ui\JqueryUiAsset',
        'grozzzny\depends\masonry\MasonryAsset',
        'grozzzny\depends\modernizr\ModernizrAsset',
        'grozzzny\depends\nested\NestedAsset',
        'grozzzny\depends\notify\NotifyAsset',
        'grozzzny\depends\stellar\StellarAsset',
        'grozzzny\depends\owl_carousel\OwlAsset',
        'grozzzny\depends\parallax\ParallaxAsset',
        'grozzzny\depends\scrollreveal\ScrollRevalAsset',
        'grozzzny\depends\smoothscroll\SmoothscrollAsset',
        'grozzzny\depends\waypoints\WaypointsAsset',
        'grozzzny\depends\wow_animations\WowAnimationsAsset',
        'grozzzny\depends\gmap\GmapAsset',
        'grozzzny\depends\swiper\SwiperAsset',
        'grozzzny\depends\fancybox\FancyboxAsset',
        'grozzzny\depends\sticky\StickyAsset',
        'grozzzny\depends\cookie\CookieAsset',
        'grozzzny\depends\toastr\ToastrAsset',
        'grozzzny\depends\sweetalert\SweetalertAsset',
        'grozzzny\depends\eonasdan\EonasdanBootstrapDatetimepickerAsset',
        'grozzzny\depends\threejs\ThreejsAsset',
        'grozzzny\depends\wagerfield_parallax\WagerfieldParallaxAsset',
        'grozzzny\depends\countdown\CountdownAsset',
        'grozzzny\depends\bootstrap_datepicker\BootstrapDatepickerAsset',
        'grozzzny\depends\easing\EasingAsset',
        'grozzzny\depends\aos\AosAsset',
        'grozzzny\depends\icomoon\IcomoonAsset',
    ];
    ...
}

主题复选框

不带 js 的单标签复选框。复选框主题

grozzzny\depends\checkbox_theme\CheckboxThemeAsset

Aos

滚动动画库 aos

grozzzny\depends\aos\AosAsset

Icomoon

图标 Icomoon

grozzzny\depends\icomoon\IcomoonAsset

Glyphicon icons

图标 Glyphicon icons

grozzzny\depends\glyphicon\GlyphiconAsset

Easing

jQuery Easing v1.3

grozzzny\depends\easing\EasingAsset

倒计时

倒计时。 jQuery.countdown

grozzzny\depends\countdown\CountdownAsset

Bootstrap Datepicker

日期选择器。 bootstrap-datepicker

grozzzny\depends\bootstrap_datepicker\BootstrapDatepickerAsset

froala

一个美观的 JavaScript 网页编辑器，易于集成，用户会对它的简洁设计爱不释手。 HTML 编辑器

grozzzny\depends\froala\FroalaAsset

morris.js

制作美观的图表不应那么困难。 morris.js

grozzzny\depends\morris\MorrisAsset

社交网络分享插件

jsSocials 是一个简单的社交网络分享 jQuery 插件。它灵活且易于扩展。配置视觉外观。选择提供的几种主题之一。如果需要，添加任何尚未支持的社会网络。 jsSocials

grozzzny\depends\jssocials\JssocialsAsset

 $("#share").jsSocials({
	shares: ["email", "twitter", "facebook", "googleplus", "linkedin", "pinterest", "stumbleupon", "whatsapp"]
});

highlight.js

Web 语法高亮 highlight.js

grozzzny\depends\highlight\HighlightAsset

<script>
	hljs.initHighlightingOnLoad();
</script>

受 Google 的 Material Design 启发的点击效果

受 Google 的 Material Design 启发的点击效果。 http://fian.my.id/Waves/

grozzzny\depends\waves\WavesAsset

响应式表格

这是一个用于复杂数据的响应式表格的实验性解决方案。响应式表格

grozzzny\depends\responsive_tables\ResponsiveTablesAsset

Cropper.js

JavaScript 图像裁剪器。 Cropper.js

grozzzny\depends\cropper\CropperAsset

Jarallax

使用 CSS 变换实现平滑的视差滚动效果，为旧浏览器提供优雅降级。 Jarallax

grozzzny\depends\jarallax\JarallaxAsset

three.js

本节的目标是简要介绍 three.js。 three.js

grozzzny\depends\threejs\ThreejsAsset

Bootstrap 4 的 Material Design

构建响应式、移动优先网站和应用程序的最受欢迎的框架。 https://mdbootstrap.com

grozzzny\depends\mdbootstrap\MDBootstrapAsset
grozzzny\depends\mdbootstrap\MDBootstrapPluginAsset

EonasdanBootstrapDatetimepickerAsset

Bootstrap 3 日期选择器 v4 文档日期选择器

grozzzny\depends\eonasdan\EonasdanBootstrapDatetimepickerAsset

 <div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
</div>

Sweetalert

美丽的成功消息、错误消息的替代品 Sweetalert

grozzzny\depends\sweetalert\SweetalertAsset

 swal({
	title: "Удалить данный блок?",
	text: "You will not be able to recover this imaginary file!",
	type: "warning",
	showCancelButton: true,
	confirmButtonColor: "#DD6B55",
	confirmButtonText: "Да, удалить!",
	closeOnConfirm: false
}, function () {
	swal("Deleted!", "Your imaginary file has been deleted.", "success");
});

Toastr

toastr 是一个用于非阻塞通知的 JavaScript 库。需要 jQuery。目标是创建一个可以自定义和扩展的简单核心库。 Toastr

grozzzny\depends\toastr\ToastrAsset

// Display a warning toast, with no title
toastr.warning('My name is Inigo Montoya. You killed my father, prepare to die!')

// Display a success toast, with a title
toastr.success('Have fun storming the castle!', 'Miracle Max Says')

// Display an error toast, with a title
toastr.error('I do not think that word means what you think it means.', 'Inconceivable!')

// Immediately remove current toasts without using animation
toastr.remove()

// Remove current toasts using animation
toastr.clear()

// Override global options
toastr.success('We do have the Kapua suite available.', 'Turtle Bay Resort', {timeOut: 5000})

Bootstrap v4

Bootstrap 是全球最受欢迎的 HTML、CSS 和 JS 框架，用于在网络上构建响应式、移动优先的项目。 bootstrap v4

grozzzny\depends\bootstrap4\Bootstrap4Asset
grozzzny\depends\bootstrap4\Bootstrap4PluginAsset

POPPER.JS

一个用于管理网页应用中弹出器的优秀库 POPPER.JS

grozzzny\depends\popper\PopperAsset

Font Awesome 5

使用 Font Awesome，在您的网站上获取矢量图标和社交标志，这是网络上最受欢迎的图标集和工具集。 Font Awesome 5

grozzzny\depends\fontawesome5\FontAwesome5Asset

Tether

一个定位引擎，用于使覆盖层、工具提示和下拉菜单变得更好 #hubspot-open-source tether

grozzzny\depends\tether\TetherAsset

bxSlider

响应式 jQuery 内容滑块 bxSlider

grozzzny\depends\bxslider\BxsliderAsset

FlexSlider

一款出色的、完全响应式的 jQuery 滑块工具集 FlexSlider

grozzzny\depends\flexslider\FlexsliderAsset

Font Awesome

Font Awesome 提供可缩放的矢量图标，可以立即进行自定义 - 大小、颜色、阴影，以及任何可以使用 CSS 实现的设置 Font Awesome

grozzzny\depends\font_awesome\FontAwesomeAsset

Jquery migrate 3.x

将页面上的 jQuery 版本升级到最新的 3.0 版本（目前为 3.0.0），并添加未压缩的 Jquery migrate 3.x

grozzzny\depends\jquery_migrate\JqueryMigrateAsset

Masonry

层叠网格布局库 Masonry

grozzzny\depends\masonry\MasonryAsset

Modernizr

Modernizr 是一个 JavaScript 库，用于检测用户浏览器中的 HTML5 和 CSS3 特性。 Modernizr

grozzzny\depends\modernizr\ModernizrAsset

jQuery Nested

提供完整的无缝、多列网格布局体验。 jQuery Nested

grozzzny\depends\nested\NestedAsset

Notify

屏幕上的消息

grozzzny\depends\notify\NotifyAsset

notify.success('message');

或

notify.error('message');

Stellar

视差效果从未如此简单。 Stellar

grozzzny\depends\stellar\StellarAsset

Wagerfield Parallax

响应智能设备方向的视差引擎。 Parallax

grozzzny\depends\wagerfield_parallax\WagerfieldParallaxAsset

Owl Carousel 2

一个触摸启用的 jQuery 插件，允许您创建一个漂亮的响应式旋转木马滑块。 Owl Carousel 2

grozzzny\depends\owl_carousel\OwlAsset

Parallax

Parallax.js 是一个简单的视差滚动效果，灵感来源于 Spotify.com，并作为 jQuery 插件实现。 Parallax

grozzzny\depends\parallax\ParallaxAsset

ScrollReveal

适用于网页和移动浏览器的简单滚动动画。 ScrollReveal

grozzzny\depends\scrollreveal\ScrollRevalAsset

$(document).ready(function(){
    /************************
     - Scroll reveal -
     ************************/
    window.sr = new scrollReveal({
        reset:true,
        move:"10px",
        mobile:false
    });
});

<div data-sr="enter left and move 40px over 1s">

</div>

Smoothscroll

一个微型、标准兼容的平滑滚动脚本，具有渐变效果，无依赖项。 Smoothscroll

grozzzny\depends\smoothscroll\SmoothscrollAsset

Waypoints

Waypoints 是一个库，使得在滚动到元素时执行函数变得容易。 Waypoints

grozzzny\depends\waypoints\WaypointsAsset

.stuck {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

<div class="js-sticky">

</div>

// Fixed header
//-----------------------------------------------
if ($('.js-sticky').length) {
    var sticky = new Waypoint.Sticky({
        element: $('.js-sticky'),
        //wrapper: '<div class="sticky-wrapper waypoint" />',
        //stuckClass: 'object-visible',
        //handler: function(direction) {
        //    $('body').toggleClass('fixed-header-on');
        //},
        //offset: -1
    });
}

Wow 动画和 animate.css

在向下滚动页面时显示 CSS 动画。默认情况下，您可以使用它来触发 animate.css 动画。但您可以轻松更改设置以使用您最喜欢的动画库。 Wow 动画库动画。 animate.css

grozzzny\depends\wow_animations\WowAnimationsAsset

$(document).on('ready', function(){
    /************************
     - WOW animation -
     ************************/
    jQuery(document).ready(function() {
        new WOW().init();
    });
});

<div class="animated fadeIn wow" data-wow-duration="1s" data-wow-delay="2s">

</div>

Gmap

一个轻量级的jQuery插件，帮助您使用API V3将谷歌地图嵌入到您的网站中。原始地址在 Gmap

grozzzny\depends\gmap\GmapAsset

$config = [
    'components' => [
        ...
        'assetManager' => [
            ...
            'bundles' => [
                'grozzzny\depends\gmap\GmapAsset' => [
                    'key' => 'AIzaSyCtX2Fg1fOnnX1Pu1n1lXvmb303Q_1234',
                ],
            ]
        ]
    ]
];

Swiper

最现代的移动触摸滑块 Swiper

grozzzny\depends\swiper\SwiperAsset

 <div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <a href="#">
                <img alt="" src="image_1.jpg" />
            </a>
        </div>
        <div class="swiper-slide">
            <a href="#">
                <img alt="" src="image_2.jpg" />
            </a>
        </div>
    </div>
    <!-- Add Pagination -->
    <div class="swiper-pagination"></div>
   
</div>

var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: 4000,
        autoplayDisableOnInteraction: false
    });

Fancybox

FancyBox 是一款工具，用于以Mac风格的“灯箱”显示图片、HTML内容和多媒体内容，该灯箱浮动在网页上方。 Fancybox

grozzzny\depends\fancybox\FancyboxAsset

<a href="image_1.jpg" data-fancybox="group" data-caption="">
    <img src="image_1_preview.jpg" alt="" />
</a>

$('.fancybox').fancybox();
//OR
$("a[href$='.jpg'],a[href$='.png'],a[href$='.gif']").attr('rel', 'gallery').fancybox({
    loop : true,
    closeClick : false,
    nextEffect : 'none',
    prevEffect : 'none',
    openEffect : 'elastic',
    closeEffect : 'elastic',
    openEasing : 'swing',
    closeEasing : 'swing'
 });

Jquery Ui

jQuery UI 是基于jQuery JavaScript库的一套用户界面交互、效果、小工具和主题。 jqueryui

grozzzny\depends\jquery_ui\JqueryUiAsset

Dragula

Dragula 提供了最简单的API，使您的应用程序中的拖放变得轻而易举。 dragula

grozzzny\depends\dragula\DragulaAsset

dragula(containers, {
  isContainer: function (el) {
    return false; // only elements in drake.containers will be taken into account
  },
  moves: function (el, source, handle, sibling) {
    return true; // elements are always draggable by default
  },
  accepts: function (el, target, source, sibling) {
    return true; // elements can be dropped in any of the `containers` by default
  },
  invalid: function (el, handle) {
    return false; // don't prevent any drags from initiating by default
  },
  direction: 'vertical',             // Y axis is considered when determining where an element would be dropped
  copy: false,                       // elements are moved by default, not copied
  copySortSource: false,             // elements in copy-source containers can be reordered
  revertOnSpill: false,              // spilling will put the element back where it was dragged from, if this is true
  removeOnSpill: false,              // spilling will `.remove` the element, if this is true
  mirrorContainer: document.body,    // set the element that gets mirror elements appended
  ignoreInputTextSelection: true     // allows users to select input text, see details below
});

Dragon Drop

一个可访问的拖放列表排序插件。 Dragon Drop

grozzzny\depends\dragon_drop\DragonDropAsset

var demo2 = document.getElementById('demo-2');
new DragonDrop(demo2, {
  handle: false,
  announcement: {
    grabbed: function(el) {},
    dropped: function(el) {},
    reorder: function(el, items) {},
    cancel: 'Reschedule cancelled.'
  }
});

PlainDraggable

一个简单且高性能的库，允许HTML/SVG元素可拖动。 PlainDraggable

grozzzny\depends\plain_draggable\PlainDraggableAsset

jQuery Sticky

Sticky 是一个jQuery插件，允许您使页面上的任何元素始终可见。 Sticky

grozzzny\depends\sticky\StickyAsset

$(document).ready(function(){
    $("#sticker").sticky({topSpacing:0});
  });

jQuery Cookie Plugin

一个简单、轻量级的jQuery插件，用于读取、写入和删除cookies。 jQuery Cookie Plugin

'grozzzny\depends\cookie\CookieAsset'

//Create session cookie:
$.cookie('name', 'value');

//Create expiring cookie, 7 days from then:
$.cookie('name', 'value', { expires: 7 });

//Create expiring cookie, valid across entire site:
$.cookie('name', 'value', { expires: 7, path: '/' });

//Read cookie:
$.cookie('name'); // => "value"

// Returns true when cookie was successfully deleted, otherwise false
$.removeCookie('name'); // => true

grozzzny / depends

维护者

详细信息