前端学习随身记

1.巧用trigger(jQuery)

$(function () {
    /*监听屏幕大小*/
    $(window).on('resize', function () {
        /*获取屏幕宽度*/
        var items = $('.carousel-inner').find('.item');
        var width = $(window).width();
        if (width >= 768) {
            /*为每格item动态添加*/
            items.each(function (index,value) {
                var item = $(this);
                var imgSrc = item.data('largeImage');//自定义属性:data-large-image   获取属性值:data('largeImage')
                console.log(imgSrc);
                item.html($('<a href="javascript:;" class="pcImg"></a>').css('backgroundImage',"url('"+imgSrc+"')"));
            });
        }
        else {
            items.each(function (index,value) {
                var item = $(this);
                var imgSrc = item.data('smallImage');
                item.html('<a href="javascript:;" class="mobileImg"><img src="'+imgSrc+'" alt="..."></a>')
            })
        }
    }).trigger('resize');//trigger() 方法触发被选元素的指定事件类型
});