Я использую пользовательский интерфейс jQuery для создания всплывающей подсказки для поля ввода поиска. Затем я хочу поместить всплывающую подсказку в соответствии с размером окна браузера (верхний, если меньше 768 пикселей, если больше).Изменить положение всплывающей подсказки при изменении окна
Я инициализируется подсказке с:
$('#search').tooltip({'placement':'top'});
Тогда я эту функцию, чтобы изменить размещение в зависимости от размера окна:
$(window).on('resize', function() {
if ($(window).width < 768) {
$("#damSearch").tooltip({'placement':'top'});
} else {
$("#damSearch").tooltip({'placement':'left'});
}
}).trigger('resize');
По какой-то причине он не работает. Всплывающая подсказка инициализируется штрафом, но когда я изменяю размер браузера выше 768 пикселей, он по-прежнему выглядит сверху.
[EDIT]
Я отсутствовал в течение нескольких дней, и только что вернулся, чтобы попытаться решить эту проблему. Я установил Modernizr, потому что намерен использовать его в другом месте на сайте, поэтому я решил использовать Modernizr.mq для определения размера окна. Я также читал в другом месте, что код, чтобы изменить всплывающую подсказку должен находиться в своей собственной самостоятельной содержал функции, так что это функция:
function positionTooltip() {
if (Modernizr.mq('(min-width: 768px)')) {
$("#damSearch").tooltip({'placement':'left'});
} else {
$("#damSearch").tooltip({'placement':'bottom'});
}
}
Затем следует в моем Javascript файл с:
$(document).ready(function() {
positionTooltip();
// Fire the function on page load
$(window).resize(positionTooltip);
// Fire function on window resize event
К сожалению, он все еще работает неправильно. Всплывающая подсказка отображается правильно, если страница загружена первой, но если я изменил размер браузера, позиция не будет обновлена. Если я перезагружаю страницу, однако позиция всплывающей подсказки изменяется соответствующим образом.
Как будто событие изменения размера не вызывает функцию.
[/ EDIT]
Как всегда вся помощь и совет высоко ценится. Тони.
Спасибо за вашу помощь PhilVarg но была опечатка в коде я вывесил. Я включил круглые скобки в свой исходный код, но оставил их при создании сообщения! Я обновил свой пост, чтобы отразить изменения, которые я сделал, чтобы попытаться (безуспешно) решить проблему. – tcarnell