Логотип
Маковецкий.RU
Ссылка на твиттер

26 комментариев к записи "Всплывающие подсказки на CSS"

  1. Руслан от пишет:

    А можно ли сделать так что бы подсказка вылазила не на картинке, а над картинкой и можно ли поменять форму на произвольную рамки?

    • Никита от пишет:

      Конечно можно. Нужно только с кодом поработать — изменить положение подсказки относительно изображения, задав отступы.

      • Руслан от пишет:

        Тогда нужно покопаться в коде и настроить под себя.

  2. Елена Олейникова от пишет:

    Интересно, а почему блогеры так редко используют всплывающие подсказки? Ладно, пусть не все соображают, как в CSS это сделать, но можно же их вывести просто с помощью тэга title.

    • Никита от пишет:

      Можно, но, как видите, не всем это охота)))

      • Елена Олейникова от пишет:

        Надо тогда какой-нибудь эксперимент поставить, проверить, как влияют такие подсказки на продвижение и, если такое влияние есть (а оно должно быть непременно), рассказать и показать. Тогда точно начнут ставить :-)

        • Никита от пишет:

          Есть такое понятие, как оптимизация изображений, где прописывание атрибутов title и alt является частью оптимизации всей статьи!

        • Елена Олейникова от пишет:

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

  3. Евгений от пишет:

    А можно сделать как нибудь чтобы в сплывающей подсказке была ссылка или картинка в виде ссылки на которые можно было бы навести и подсказка не убралась. При этом подсказка бы активировалась при наведении.

    • Никита от пишет:

      Не совсем понял Вас, но вставить ссылку, или картинку-ссылку во всплывающую подсказку можно.

      • Евгений от пишет:

        К примеру дана ссылка Ссылка. Нужно сделать подсказку чтобы в нее можно было поместить другие ссылки так же картинки не оборачивая при этом основную ссылку не в какие теги. Также нужно чтобы подсказка сразу не убиралась и чтобы пользователь мог перейти на те ссылки которые в подсказке. Подскажите как можно это реализовать…

        • Никита от пишет:

          Здесь одним CSS не обойдешься. Придется использовать JavaScript или Jquery, а вот как именно это сделать, к сожалению не могу подсказать.

          • Евгений от пишет:

            а хотя бы как на цсс сделать чтобы в ссылку можно было просто вставить подсказку в виде ссылки и она бы коректно отображалась там…

          • Никита от пишет:

            Я Вам могу посоветовать поискать на Ruseller.com — там есть несколько уроков по Вашему вопросу.

  4. Мурад от пишет:

    Действительно полезная статья.
    Спасибо)

  5. Ира от пишет:

    Я пробовала ставить и второй, и третий вариант, но вторая подсказка у меня всплывает обрезанная, а третья вообще невидимая. Я стараюсь покрутить что-то с z-index и position, пока безрезультатно.

  6. ZGD от пишет:

    А можно ли сделать так, что бы подсказка не моментально появлялась, а возникала плавно? Либо проявляясь из совсем прозрачной в непрозрачную, либо медленно выезжала.

  7. Юрий от пишет:

    День добрый! Спасибо за статью но не получается вставить в подсказку текст-ссылку. Как осуществить ?

  8. Юрий от пишет:

    content: attr(data-text)/ . data-text- не позволяет вставлять теги , , и ссылки

  9. ZGD от пишет:

    А можно ли сделать так, что если подсказка не убирается на экран, ну то есть если элемент с подсказкой находится внизу видимой области, то в этом случае подсказка вылазила бы сверху? Я говорю про вариант с тэгом

    • Никита от пишет:

      Что-то не совсем понял Вас. А чем вариант с выводом подсказки над ссылкой не устраивает?

  10. ZGD от пишет:

    Ну вот прокрутите так, чтобы ваш пример:
    «Результат:
    Наведи курсор»
    С вариантом через был в самом низу видимой части страницы. Тогда всплывающая подсказка уйдёт вниз, в невидимую часть экрана.
    А вот вариант с в таком случае выведет подсказку сверху от примера и её будет видно. Так вот можно ли, что бы и в первом варианте она действовала таким же образом?

    • Никита от пишет:

      У меня тут 2 примера с одинаковым названием: «Результат: Наведи курсор»

  11. ZGD от пишет:

    Тэги не проходят в коментарии, поэтому не понятно получилось. В общем, пример с тайтлом и классом podskazka выводит всплывашку внизу от ссылки, но если ссылка расположена в самом низу видимого окна браузера, тогда всплывашка, что бы не уйти за экран, показывается сверху. В примере же со span’ом всплывашка в любом случае выводится внизу, даже если ссылка расположена внизу окна браузера, то всплывашка просто уходит за экран. Вот можно ли как то организовать проверку, что бы всплывашка показывалась сверху, если она не убирается в экране? Да и кстати, в примере с тайтлом вместе с подсказкой, которая организована через css, через пару секунд всплывает и стандартная браузерная подсказка, что в корне разрушает все старания по улучшению вида всплываемой подсказки.

  12. ZGD от пишет:

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

  1. Комментарии, содержащие нецензурную брань, грубейшие грамматические ошибки, или албанскую лексику, удаляются.
  2. В поле "Сайт" можно указывать только ссылку на главную страницу вашего сайта/блога. Ссылки на прочие веб-ресурсы, или партнерские ссылки будут удалены.
  3. Запрещается использовать в качестве имени комментатора слоганы/названия сайтов, рекламные фразы, адреса сайтов. Просьба указывать нормальное имя или ник.
  4. Короткие, бессмысленные кoммeнтapии типа "Спасибо!", "Интересная статья", будут удалены.
  5. Комментарии не по теме, спам, любая реклама в сообщениях будут удалятся.

:wink: :-| :-x :twisted: :) 8-O :( :roll: :-P :oops: :-o :mrgreen: :lol: :idea: :-D :evil: :cry: 8) :arrow: :-? :?: :!: