Проблемы с bootstrap-image-gallery.min.js и заголовками CSP в проекте AngularJS.Jquery

Программирование на jquery
Ответить Пред. темаСлед. тема
Anonymous
 Проблемы с bootstrap-image-gallery.min.js и заголовками CSP в проекте AngularJS.

Сообщение Anonymous »

Я использую библиотеку bootstrap-image-gallery.min.js в своем проекте AngularJS. Я импортировал библиотеку в свой файл cshtml, но столкнулся с проблемами с модальным всплывающим окном. Когда всплывающее окно открывается, кнопки («Далее», «Предыдущий», «Слайд-шоу», «Загрузить») скрыты благодаря классам hide, fade и **modal**.
Если я вручную удалю атрибут «скрытый», кнопки станут видимыми, но нажатие на них не активирует соответствующие функции. Кроме того, я использую следующие заголовки политики безопасности контента (CSP) в своем файле web.config:

< strong>Файл Cshtml

Код: Выделить всё

[*]



























[i]





[/i]
Add files...
[i]


[/i]
Cancel upload






[i]











 










[url={%=file.url%}][i][/url]
{% } %}

[url={%=file.url%}]{%=file.name%}[/url]

{%=o.formatFileSize(file.size)%}

{% } %}

@*            
[/i]
{%=locale.fileupload.destroy%}
*@

@*            *@


{% } %}


Файл bootstrap-image-gallery.min.js

Код: Выделить всё

(function(a){"use strict",typeof define=="function"&&define.amd?define(["jquery","./load-image.js","bootstrap"],a):a(window.jQuery,window.loadImage)})(function(a,b){"use strict",a.extend(a.fn.modal.defaults,{delegate:document,selector:null,index:0,href:null,preloadRange:2,offsetWidth:100,offsetHeight:200,canvas:!1,slideshow:0});var c=a.fn.modal.Constructor.prototype.show,d=a.fn.modal.Constructor.prototype.hide;a.extend(a.fn.modal.Constructor.prototype,{initLinks:function(){var b=this,c=this.options,d=c.selector||"a[data-target="+c.target+"]",e=0;a(c.delegate).find(d).each(function(d,f){var g=f.href||a(f).data("href");b.urls[b.urls.length-1]!==g&&(b.urls.push(g),b.titles.push(f.title),g===c.href&&(c.index=e),e+=1)}),this.urls[c.index]||(c.index=0)},startSlideShow:function(){var a=this;this.options.slideshow&&(this._slideShow=window.setTimeout(function(){a.next()},this.options.slideshow))},stopSlideShow:function(){window.clearTimeout(this._slideShow)},toggleSlideShow:function(){var a=this.$element.find(".modal-slideshow");this.options.slideshow?(this.options.slideshow=0,this.stopSlideShow()):(this.options.slideshow=a.data("slideshow")||5e3,this.startSlideShow()),a.find("i").toggleClass("icon-play icon-pause")},preloadImages:function(){var b=this.options,c=b.index+b.preloadRange+1,d,e;for(e=b.index-b.preloadRange;e480&&(d&&(g=c.clone().hide().appendTo(document.body)),e.call(c.stop(),{"margin-top":-((g||c).outerHeight()/2),"margin-left":-((g||c).outerWidth()/2)}),g&&g.remove()),f.append(b),h=b.offsetWidth,a(b).addClass("in")},abortLoad:function(){this.loadingImage&&(this.loadingImage.onload=this.loadingImage.onerror=null),window.clearTimeout(this._loadingTimeout)},prev:function(){var a=this.options;a.index-=1,a.indexthis.urls.length-1&&(a.index=0),this.loadImage()},keyHandler:function(a){switch(a.which){case 37:case 38:a.preventDefault(),this.prev();break;case 39:case 40:a.preventDefault(),this.next()}},wheelHandler:function(a){a.preventDefault(),a=a.originalEvent,this._wheelCounter=this._wheelCounter||0,this._wheelCounter+=a.wheelDelta||a.detail||0;if(a.wheelDelta&&this._wheelCounter>=120||!a.wheelDelta&&this._wheelCounter480&&b.css({"margin-top":-(b.outerHeight()/2),"margin-left":-(b.outerWidth()/2)}),this.initGalleryEvents(),this.initLinks(),this.urls.length&&this.loadImage()}c.apply(this,arguments)},hide:function(){this.isShown&&this.$element.hasClass("modal-gallery")&&(this.options.delegate=document,this.options.href=null,this.destroyGalleryEvents()),d.apply(this,arguments)}}),a(function(){a(document.body).on("click.modal-gallery.data-api",'[data-toggle="modal-gallery"]',function(b){var c=a(this),d=c.data(),e=a(d.target),f=e.data("modal"),g;f||(d=a.extend(e.data(),d)),d.selector||(d.selector="a[rel=gallery]"),g=a(b.target).closest(d.selector),g.length&&e.length&&(b.preventDefault(),d.href=g.prop("href")||g.data("href"),d.delegate=g[0]!==this?this:document,f&&a.extend(f.options,d),e.modal(d))})})});
Что я пробовал:
  • Удаление скрытых, затухающих и модальных классов: Кнопки становятся видимыми, но нажатие на них не запускает никаких функций.
  • Проверил консоль браузера на наличие ошибок.
  • Проверил, что все файлы JavaScript загружены правильно.
  • Убедился, что модальное окно запускается и отображается правильно.
Изображение внешнего интерфейса

Подробнее здесь: https://stackoverflow.com/questions/787 ... js-project
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «Jquery»