display tooltip on hover over text

Question

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

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

Answer 1

Существует множество полезных плагинов для создания полезных всплывающих подсказок.

Я знаю, что два из них, которые используют jQuery рамку:

• MB-подсказку: [http://pupunzi.open-lab.com/mb-jquery-components/mb-tooltip/]
• JQuery-плагин-подсказка: [http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/]

У вас есть окружать ваши ключевые слова элементом span и классом, чтобы применить селектор jQuery. Возможно, предпочтительнее запрашивать наличие ключевого слова на стороне сервера, создавая специальный html-код для отображения правильных всплывающих подсказок, в противном случае вам нужно создать всплывающую подсказку по AJAX, обрабатывая событие наведения мыши по ключевому слову.

Answer 2

Существует очень популярный Jquery Plugin "Советы по красоте", для этого:

http://www.lullabot.com/files/bt/bt-latest/DEMO/index.html

Пример Советы по красоте с вариантами:

$('#example3').bt({ 
    contentSelector: "$(this).attr('href')", 
    fill: 'red', 
    cssStyles: {color: 'white', fontWeight: 'bold'}, 
    shrinkToFit: true, 
    padding: 10, 
    cornerRadius: 10, 
    spikeLength: 15, 
    spikeGirth: 5, 
    positions: ['left', 'right', 'bottom'] 
}); 

Answer 3

Используйте всплывающую подсказку плагин JQuery, который может быть найдено here.

код выглядит следующим образом:

$("img[title]").tooltip() 

Answer 4

Вы также можете использовать YUI в качестве альтернативы плагинов JQuery. Вот пример того, что вы хотите сделать. Simple Tooltip Example with YUI

Answer 5

Возможно, вы можете использовать HTML Global title Attribute. Если вы ищете что-то простое, которое уже встроено в HTML (и, следовательно, оно можно использовать в PHP без добавлений), это будет моим решением. Я считаю, что это использование в проекте.