Простой скрипт jquery, работающий в одиночку, но не работающий на моей странице vbulletin

Заранее спасибо, если вы можете мне помочь, потому что я действительно не могу понять, в чем дело.

Я пытаюсь отобразить изображение при наведении мышкой на ссылку. Провел много исследований и нашел для этого очень простой скрипт jquery. Я реализовал его на своей тестовой странице, и он отлично работает: http://hearthstonehelp.com/test.html (обратите внимание, что для упрощения теста я использую прямую ссылку в приведенном ниже примере)

<html>
<head>
  <script type="text/javascript" src="http://www.hearthstone.com/images/styles/gamingo/js/jquery.min.js"></script>
  <script type="text/javascript" src="http://www.hearthstone.com/images/styles/gamingo/js/tooltip_card.js"></script>
</head>

<body>
  <a href="http://eu.battle.net/hearthstone/static/images/cards/03.png" class="hearthstonecardimage" rel="http://eu.battle.net/hearthstone/static/images/cards/03.png">Fireball</a>
</body>

</html>

Теперь при реализации точно такой же вещи в моем экземпляре vbulletin здесь: http://hearthstonehelp.com/ (несмотря на то, что он имеет точно такой же код, изображение не отображается).

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

Любая мысль будет по достоинству оценена.

Источник

1 ответ

Решение

Я был на http://www.hearthstonehelp.com/showthread.php?463-Card-popup-previews где вы пытались использовать скрипт. Через некоторое время я заметил, что изображение на самом деле отображается в правом нижнем углу вашего тела. (уменьшите максимум, затем наведите огненный шар, и вы увидите его, если прокрутите вниз). Проблема с элементом p и это CSS

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

РЕДАКТИРОВАТЬ: Это должно работать

В вашем tooltip_card.js измените код на этот

$("#hearthstonecardimage")
        .css("top",(e.pageY + 10) + "px")
        .css("left",(e.pageX + 10) + "px")
        .css("position", "absolute")
        .fadeIn("fast");
Источник
Другие вопросы по тегам