ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка

Объявление

Загадочный Дом «Кузнечик»

Форумные игры, кино, позитивное отношение и душевное общение!
Есть в мире место, где душе тепло...
Заходи, мы будем тебе рады!

Подробнее

Мийрон

Качественный пиар быстро и недорого.
Красивейшие дизайны по низким ценам.
Каталог ролевых игр.

Подробнее

Дизайн «Warlords of Draenor»

Детализированный rpg-дизайн для MyBB форума гильдии «Warlords of Draenor»
Стоимость при покупке эксклюзивно: 6300р
В стоимость входит настройка и корректировка дизайна под ваш проект.

Подробнее

Светлый дизайн в фентези стиле с аниме-графикой

Макет для светлого дизайна в фентези стиле с аниме-графикой.
Стоимость: 2600р*
Дизайн продается эксклюзивно (в одни руки).

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайте
Стать модераторомОтзывы

Предложения

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка » Javascript, Jquery и CSS решения » Всплывающие подсказки title со своим дизайном


Всплывающие подсказки title со своим дизайном

Сообщений 1 страница 9 из 9

1

Всплывающие подсказки title со своим дизайном
Заменяет стандартные подсказки title на всплывающие блоки со своим стилем.

http://forumuploads.ru/uploads/0007/e3/f7/2/850228.jpg

Скрипт:

Код:
<script src='https://forumstatic.ru/files/0012/9a/62/92819.js'></script>
<script>
$(function(){
$('*[title]').quicktip({
speed:700 //Скорость появления подсказки
});
});
</script>

Стиль:

Код:
#tooltip {
  position:absolute;
  background:#DDD;
  box-shadow: 3px 10px 7px -7px #9c8eac, -3px -3px 0px 0px #495879, inset 0px 0px 20px 0px #707070;
  border-radius: 5px;
  border-top: 3px solid #aa3d02 !important;
  border-bottom: 2px solid #25222e !important;
  margin: 0.4em 1.8em 1.4em 1.8em;
  padding: 1em;
  font-weight:bold;
  font-size:14px;
  display:none;
}

0

2

У меня засада , не ведаю как на компе у людей, а на планшетах подсказки , выглядят так :
https://forumuploads.ru/uploads/0007/e3/f7/6763/t968186.png

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

Если ещё положение подсказки поправить, вообще, классно будет.

0

3

Алгол написал(а):

У меня засада , не ведаю как на компе у людей, а на планшетах подсказки , выглядят так :

ты имеешь в виду то, что подсказка находится под всплывающими окнами в ФО?
добавь в стиль подсказки вот такую штуку:

#tooltip {
  position:absolute;
  background:#DDD;
  box-shadow: 3px 10px 7px -7px #9c8eac, -3px -3px 0px 0px #495879, inset 0px 0px 20px 0px #707070;
  border-radius: 5px;
  border-top: 3px solid #aa3d02 !important;
  border-bottom: 2px solid #25222e !important;
  margin: 0.4em 1.8em 1.4em 1.8em;
  padding: 1em;
  font-weight:bold;
  font-size:14px;
  display:none;
z-index: 99999999;
}

будет поверх ВСЕГО, что только может быть.

Если ещё положение подсказки поправить, вообще, классно будет.

можно поправить через вот этот код не только положение, но и дизайн под твой форум.
если нужна помощь в этим, могу сваять под все три стиля.

+1

4

Герда написал(а):
Алгол написал(а):

У меня засада , не ведаю как на компе у людей, а на планшетах подсказки , выглядят так :

ты имеешь в виду то, что подсказка находится под всплывающими окнами в ФО?
добавь в стиль подсказки вот такую штуку:

#tooltip {
  position:absolute;
  background:#DDD;
  box-shadow: 3px 10px 7px -7px #9c8eac, -3px -3px 0px 0px #495879, inset 0px 0px 20px 0px #707070;
  border-radius: 5px;
  border-top: 3px solid #aa3d02 !important;
  border-bottom: 2px solid #25222e !important;
  margin: 0.4em 1.8em 1.4em 1.8em;
  padding: 1em;
  font-weight:bold;
  font-size:14px;
  display:none;
z-index: 99999999;
}

будет поверх ВСЕГО, что только может быть.

Если ещё положение подсказки поправить, вообще, классно будет.

можно поправить через вот этот код не только положение, но и дизайн под твой форум.
если нужна помощь в этим, могу сваять под все три стиля.

Не помогло. Оно поверх всего, да.
Но теперь мешает .
https://forumuploads.ru/uploads/0007/e3/f7/6763/t74565.jpg

А с этим эффектом как быть?
[html] <iframe width="640" height="360" src="https://radikal.ru/vf/Ft51NpmB7yH" frameborder="0" scrolling="no" allowfullscreen></iframe> [/html]
Подсказка сдвигает тело Форума.

0

5

Алгол написал(а):

Не помогло. Оно поверх всего, да.
Но теперь мешает .

как ты себе представляешь она должна располагаться, чтобы не мешать?

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

Алгол написал(а):

Подсказка сдвигает тело Форума.

у меня в мозиле на твоей подсказке еще и текст не отображается.
сдвигается из-за дизайна контейнера оценки поста. там "вшит" стиль, поторый не дает подсказке отображаться поверх. надо править и стиль подсказки (чтоб не была такая жирная и огромная), и стиль контейнера оценки поста (чтоб не "закреплял" подсказку в этом углу.
могу поправить, но я б конкретно для твоего форума посоветовала другие подсказочки поставить, а именно те, что у нас на ФД - чтоб можно было самому выбирать, где будут "дизайнутые" подсказки, а где - обычные.
постараюсь их выложить в ближайшее время

+1

6

Герда написал(а):
Алгол написал(а):

Не помогло. Оно поверх всего, да.
Но теперь мешает .

как ты себе представляешь она должна располагаться, чтобы не мешать?

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

Алгол написал(а):

Подсказка сдвигает тело Форума.

у меня в мозиле на твоей подсказке еще и текст не отображается.
сдвигается из-за дизайна контейнера оценки поста. там "вшит" стиль, поторый не дает подсказке отображаться поверх. надо править и стиль подсказки (чтоб не была такая жирная и огромная), и стиль контейнера оценки поста (чтоб не "закреплял" подсказку в этом углу.
могу поправить, но я б конкретно для твоего форума посоветовала другие подсказочки поставить, а именно те, что у нас на ФД - чтоб можно было самому выбирать, где будут "дизайнутые" подсказки, а где - обычные.
постараюсь их выложить в ближайшее время

А где , на ФД , подсказки, я все утыкала, ничего , кроме, забавного робата, не всплыло.

О, и плюс Или минус , ещё один глюк от всплывающих подсказок.
[html] <iframe width="640" height="360" src="https://radikal.ru/vf/CCYBrBY4IJt" frameborder="0" scrolling="no" allowfullscreen></iframe> [/html]

Убивает форму входа .

Спасибо большое, за пояснение и терпение , теперь буду знать, что подсказки на мобильных устройствах -это не вариант.

0

7

Герда
Прошу прощения, не могли бы Вы посмотреть почему курсор бешено себя ведет при наведении на оценку поста?
https://forumuploads.ru/uploads/0007/e3/f7/6989/t781463.png
https://nude-celebrity.ru/viewtopic.php?id=1538#p26260
Просто ума не приложу, нового ничего не ставил, может из-за правок на сервисе?

Отредактировано ACT3255 (18.11.2020 10:40:20)

+1

8

ACT3255
думаю, тут та же проблема, что и глюк на кузнечике: Всплывающие подсказки title со своим дизайном

у тебя на рейтинге поста завязано два события:
1. всплывание подсказки title
2. всплывание проголосовавших

есть предположение, что браузер не может определиться, что с этим делать, что из этого выполнять.
ибо если "устаканить" курсор, происходит такое:
https://forumuploads.ru/uploads/0007/e3/f7/2/384834.gif

попробуй "снести" title из этого места для эксперимента:

Код:
<script>
$(document).ready(function() { 
  $('.post-rating a').removeAttr("title");
});
</script>

получилось ли снести, перестал ли от этого бродить курсор?
если да, то над определяться какую из всплывалок оставить, а какую убрать.
ну, или завязать всплывалки ровно в одно и то же место (переделать событие для скрипта проголосовавших), а то всплывалки ща немного в разных местах: проголосовавшие в .post-rating, а title в ссылке a внутри этого контейнера...

+2

9

Герда написал(а):

ACT3255
думаю, тут та же проблема, что и глюк на кузнечике: Всплывающие подсказки title со своим дизайном

у тебя на рейтинге поста завязано два события:
1. всплывание подсказки title
2. всплывание проголосовавших

есть предположение, что браузер не может определиться, что с этим делать, что из этого выполнять.
ибо если "устаканить" курсор, происходит такое:
https://forumuploads.ru/uploads/0007/e3/f7/2/384834.gif

попробуй "снести" title из этого места для эксперимента:

Код:
<script>
$(document).ready(function() { 
  $('.post-rating a').removeAttr("title");
});
</script>

получилось ли снести, перестал ли от этого бродить курсор?
если да, то над определяться какую из всплывалок оставить, а какую убрать.
ну, или завязать всплывалки ровно в одно и то же место (переделать событие для скрипта проголосовавших), а то всплывалки ща немного в разных местах: проголосовавшие в .post-rating, а title в ссылке a внутри этого контейнера...

Поставил этот код, теперь вроде все нормально.

Отредактировано ACT3255 (19.11.2020 14:09:18)

0

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

Напишите ваше сообщение и нажмите «Отправить»


ВНИМАНИЕ! При обращении за техподдержкой и вопросами по скриптам/оформлению, оставляйте ссылку на форум/сайт с проблемой! Специалист должен вживую видеть проблему, чтобы подсказать как ее решить.

ВНИМАНИЕ! Гости (не зарегистрированные на форуме) могут писать сообщения, но не могут вставлять прямые ссылки! Чтобы оставить сообщение со ссылкой на сайт, форум или скриншот удалите символы: "http://", "https://" или "www."


Вы здесь » ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка » Javascript, Jquery и CSS решения » Всплывающие подсказки title со своим дизайном