Перейти к публикации
View in the app

A better way to browse. Learn more.

Дизайн и модификация Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Текстовые ссылки в сообщениях с всплывающими изображениями

Опубликовано:

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

Вроде на jquery такое есть на некоторых CMS, текст с ссылками там подчёркнут многоточием ........

 

Для IPS 4 такого нет?

Как реализовать?

Рекомендованные сообщения

Опубликовано:

Если по-простому, то можно так сделать, но только для тех групп, которые могут использовать HTML в сообщениях.

 

1. Открыть globalTemplate и вставить перед </body> следующий код:

 

            <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
 <link href="http://codegena.com/assets/css/image-preview-for-link.css" rel="stylesheet">     
 <script type="text/javascript">
   $(function() {
               $('#p1 a').miniPreview({ prefetch: 'pageload' });
               $('#p2 a').miniPreview({ prefetch: 'parenthover' });
               $('#p3 a').miniPreview({ prefetch: 'none' });
           });
 </script> <script src="http://codegena.com/assets/js/image-preview-for-link.js"></script>

 

2. Добавить в редакторе текст сообщения в HTML-режиме:

 

<p id="p1"><a href="https://artsgallery.pro">Cnet</a></p>
<p id="p2"><a href="https://artsgallery.pro">Codegena</a></p>
<p id="p3"><a href="https://artsgallery.pro">Apple</a></p>

 

Атрибуты:

id="p1" - создать и показать при наведении курсора мыши предварительный просмотр страницы по ссылке при загрузке страницы (заранее).

id="p2" - создать и показать предварительный просмотр страницы по ссылке при наведении курсора мыши на ссылку (в момент наведения).

id="p3" - создавать и показывать предварительный просмотр страницы при наведении курсора на ссылку каждый раз при наведении.

 

Очевидно, что предпочтителен вариант p2, так как будет меньше всего нагружать браузер.

 

Можно попытаться сделать так, чтобы атрибут id="p2" добавлялся в каждый тег p в редакторе автоматически. Но это нужно копать редактор. Так далеко я не заходил. Если же речь идет о простых манипуляциях, то атрибут можно добавлять руками каждый раз, когда нужно.

 

vbtBynz.jpg

 

Пример в аттаче.

 

PS Превью,кстати, кликабельны ↓

new 3.html

Изменено пользователем Zero108

Создайте аккаунт или войдите в него для комментирования

Сейчас на странице 0

  • Нет пользователей, просматривающих эту страницу.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.