Как показать спрайт поверх изображения, не находясь в том же контейнере div? - PullRequest
Новая
       27

Как показать спрайт поверх изображения, не находясь в том же контейнере div?

0 голосов
/ 27 апреля 2019

Я использую photoswipe на своем мобильном веб-сайте и хочу показать спрайт css в виде кнопки «Мне нравится» в верхней части изображения.

Это приводит к следующей ошибке при нажатии: 

psw,psw-ui,psw-custom,v1.0.0.min.js:13 Uncaught TypeError: Cannot read property 'split' of null
at psw,psw-ui,psw-custom,v1.0.0.min.js:13
at d (psw,psw-ui,psw-custom,v1.0.0.min.js:13)
at HTMLDivElement.t (psw,psw-ui,psw-custom,v1.0.0.min.js:13)

Каким-то образом фотоснимок пытается получить данные о размере в этой строке:

size = el.getAttribute ('data-size'). Split ('x');

Но естьнет атрибута data-size на моей кнопке like.

Единственное решение, которое я видел до сих пор, это переместить div likebutton div вне галереи div, но это приводит к проблемам позиционирования, так как основное изображение не всегда имеет одинаковую высотуposition. 

<span id="tese1064335" class="nhrt" style="top: 188px;right:15px;">
   <a href="#" data-ajax="false" onclick="edit_notepad(1064335, 1);return false;" rel="nofollow" title="Diese Anzeige in Ihrem Merkzettel speichern" class="sprites-1 ui-link sprite-IC_hrt_1"></a>
</span>

// gallery: 

<div id="demo-test-gallery" class="demo-gallery" itemscope="" itemtype="http://schema.org/ImageGallery">
   <div id="cl_gallery" data-pswp-uid="1"><a href="http://static.test0.jpg" data-size="900x1200" data-med="http://static.test0.jpg" data-med-size="1006x1006" data-details="test" class="demo-gallery__img--main ui-link">

   <img src="http://static.test0.jpg" alt="" width="1006" height="1006"><figure>test </figure></a>
</div>

Как я могу расположить кнопку «Мне нравится» в этом элементе div, чтобы он располагался в другом элементе div, не мешая фотоснимку?

...