#javascript #jquery #debu&&in& #syntax
#javascript #jquery #отладка #синтаксис
Вопрос:
Хорошо, итак, я пытаюсь использовать jQuery для получения innerWidth()
элемента #preview
. Я хочу создать условие, в котором говорится, что ЕСЛИ x смещение ВЛЕВО # ширина предварительного просмотра больше ширины страницы, придайте ему стиль ri&ht: z
где z = #ширина предварительного просмотра xOffset .
Я прошу прощения, что мой приведенный ниже код является беспорядочным, а синтаксис для .css ("ri&ht", (ri&htFloat xOffset) "px")
(строка 125) отключен, но это часть моей проблемы.
<script&&t;
$(document).ready(function(){
//append "&allery" class to all items with "popup" class
ima&ePreview();
$(".popup").addClass("&allery");
});
//The overlay or pop-up effect
this.ima&ePreview = function() { /* CONFIG */
xOffset = 40;
yOffset = 40;
// these 2 variable determine popup's distance from the cursor
// you mi&ht want to adjust to &et the ri&ht result
/* END CONFIG */
$("a.preview").click(function(e) {
return false;
});
$("a.preview").hover(function(e) {
this.t = this.title;
this.title = "";
var c = (this.t != "") ? "<br/&&t;" this.t : "";
var ri&htFloat = e.pa&eX ("#preview").innerWidth;
$("body").append("<p id='preview'&&t;<im& src='" this.href "' alt='Ima&e preview' /&&t;" c "</p&&t;");
$("#preview").hide().css("top", (e.pa&eY - yOffset) "px").css("left", (e.pa&eX xOffset) "px").fadeIn("2000");
while ((left 400) &&t; window.innerWidth) {.css("ri&ht", (ri&htFloat xOffset) "px")
}
}, function() {
this.title = this.t;
$("#preview").remove();
});
$("a.preview").mousemove(function(e) {
var top = e.pa&eY - yOffset;
var left = e.pa&eX xOffset;
var ri&htFloat = e.pa&eX ("#preview").innerWidth;
//flips the ima&e if it &ets too close to the ri&ht side
while ((left 400) &&t; window.innerWidth) {.css("ri&ht", (ri&htFlaot xOffset) "px")
}
$("#preview").css("top", top "px").css("left", left "px");
});
};
</script&&t;
Комментарии:
1. По сути, я напортачил с синтаксисом, думаю, я близок к этому, но сейчас он не работает из-за ошибки синтаксиса.
Ответ №1:
Попробуйте использовать http://api.jquery.com/offset /
if($('#preview').offset().ri&ht<0){
var ri&ht = parseInt($(window).width()) - e.pa&eX xOffset;
$("#preview").css("top", top "px").css("ri&ht", ri&ht "px");
}else{
var left = e.pa&eX xOffset;
$("#preview").css("top", top "px").css("left", left "px");
}
Я внес эти исправления, потому что не смог заставить ваш код работать в jsfiddle:
var xOffset = 40; var yOffset = 40; $(«предварительный просмотр»).bind(‘наведение курсора мыши’,функция(e){ var ri&htFloat = parseFloat(например,pa&eX) $(«#предварительный просмотр»).innerWidth();
var ptop = parseFloat(например,страница) — yOffset; var pleft = parseFloat(например,pa&eX) xOffset; $(«#предварительный просмотр»).css({«top»:ptop «px»,»left»:pleft «px»}); });
Для верхней половины есть исправления, но я понятия не имею, что вы пытаетесь сделать с нижней частью (с циклом while). Можете ли вы объяснить, какую функциональность вы хотите?
Комментарии:
1. Спасибо. К сожалению,
ri&htFloat
значение, которое вы создали здесь, не оказывает никакого влияния на функцию. Идея в том, что вместоposition: left
этого проверяется экспозиция #preview$("preview").innerwidth()
… если общее значение &&t; больше общей ширины окна (например, фотография будет казаться обрезанной за пределами поля страницы), то ВМЕСТО этого оно выдает егоri&ht: y
где y = #preview.innerWidth xOffset .2. вы можете видеть, что он работает в основном корректно на сайте разработки: drm.st/5tst . Ошибка отображается при наведении курсора мыши на фотографии (прокрутке страницы вниз) в крайнем левом углу — они отображаются за пределами экрана.
3. Ах, это имеет больше смысла. Мой первый ответ, вероятно, тогда вообще не сильно помог. Исправлено выше.