Jump to content

Как сделать "якоря" по тексту и вот такое меню Гайд-меню???


Litesm

Recommended Posts

На одном форуме увидел достаточно интересную реализацию Гайд-меню + якоря по тексту. При нажатии вас направляет на определённый момент в тексте. Очень круто ! Такое я делаю легко на движке ВордПресс но как это сделано на IPS не понимаю.

Выкладываясь. ссылочку, посмотрите.

https://invisionify.com/guides/monetize-communities/banner-advertising/#ad-locations-ips

 

Снимок экрана 2021-02-11 в 21.30.13.png

Link to comment
Share on other sites

А что не понятно? В меню справа - ссылки с якорями, в тексте якоря. Жмем ссылку, перепрыгиваем на якорь. А <nav></nav> генерит скрипт простенький, прошаривая по [data-role='title']

Link to comment
Share on other sites

58 минут назад, Desti сказал:

А что не понятно? В меню справа - ссылки с якорями, в тексте якоря. Жмем ссылку, перепрыгиваем на якорь. А <nav></nav> генерит скрипт простенький, прошаривая по [data-role='title']

а как они вставили это меню в статью? 

И это [data-role='title'] куда вставить нада ? Расскажите подробнее 

Link to comment
Share on other sites

9 часов назад, Litesm сказал:

а как они вставили

В jquery есть функция prepend(), которая вставляет контент первым чилдом. Родителем, в нашем случае, будет элемент, в котором объявлен скрипт. Поэтому this.scope.prepend(menu) вставит сгенеренную менюшку в начало секции.

image.thumb.png.e14d0f494ca1d87d1667dacba17be35a.png

data-title вставляется в тег заголовка секции, якорь перед ним, типа

<a id="anchor-label" rel=""></a>
<h2 class="cDocs_mainTitle" data-role="title">Заголовок</h2>

У инвижинов  для этого, скорее всего, есть приложение, а вам придется расставлять теги и якоря руками.

Link to comment
Share on other sites

  • 9 months later...

Я так понимаю автор блока с якорями спрашивал помощи тут и смог это сделать без приложения https://invisioncommunity.com/forums/topic/453642-pages-how-to-use-anchors-in-editor/

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Ваша ссылка была автоматически строена.   Отображать как обычную ссылку

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...