|
|
|
| Делаю на сайте всплывающее окно. Пытаюсь сделать по примеру http://lifeexample.ru/jquery-javascript-primeryi/vsplyivayushhee-okno-jquery.html
Но дело в том, если на сайте написано много и идет прокрутка вниз.
Нужно рассчитать высоту к месту клика, только как не знаю. Подскажите пожалуйста | |
|
|
|
|
|
|
|
для: immortal727
(28.11.2016 в 12:57)
| | http://jsbin.com/qebifa/edit?output
See JS:
var over = document.querySelector('.overlay');
var OverIm = document.querySelector('.overlay img');
over.classList.toggle('hidden');
var ImH = OverIm.height;
var WH = window.innerHeight;
if(WH > ImH){
OverIm.style.marginTop = (WH - ImH) / 2 + 'px';
}
else{
OverIm.style.marginTop = 'auto';
OverIm.style.marginBottom = 'auto';
}
|
And CSS:
.overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:215;
background-color: rgba(0, 0, 0, 0.7);
}
.overlay img{
display: block;
margin: 215px auto;
}
.hidden{
display: none;
}
|
And scroll this page to it bottom and click the button. | |
|
|
|
|
|
|
|
для: Deed
(29.11.2016 в 02:22)
| | Мне не надо к img, у меня должно идти к блоку с id
Пытаюсь изменить, но не получается ничего
// Скрипт popup окна
$(document).ready(function(){
var pop_window = $('#pop-up-window');
var X = ($(window).width()-pop_window.width())/2;
var Y = ($(window).height()-pop_window.height())/2;
var WH = window.innerHeight;
if(WH > pop_window.height()){
Y = (WH - pop_window.height()) / 2 + 'px';
}
else{
pop_window.css('top', 'auto' + 'px');
pop_window.css('bottom', 'auto' + 'px');
}
pop_window.css('left', X+ 'px');
pop_window.css('top', Y+ 'px');
pop_window.hide();
var visible_window=false;
$('#showWindow').click(function(){
if(!visible_window){
pop_window.css('display', 'block');
pop_window.css('top', -pop_window.height() + 'px');
pop_window.animate({top:Y},"slow");
visible_window=true;
}
else{
pop_window.css('display', 'block');
pop_window.animate({top:-pop_window.height()},"slow");
visible_window=false;
}
});
$('#btnClose').click(function(){
pop_window.hide(1000);
});
});
});
|
| |
|
|
|
|
|
|
|
для: immortal727
(29.11.2016 в 12:41)
| | А кто будет учитывать прокрученное? | |
|
|
|
|
|
|
|
для: confirm
(29.11.2016 в 14:18)
| | Можно просто написать расчет места где я нахожусь или подправить скрипт? | |
|
|
|
|
|
|
|
для: immortal727
(29.11.2016 в 19:25)
| | Если интересуют координаты щелчка и к ним привязать нужно нечто, то это нечто должно позиционироваться абсолютно, а значит прокрутка документа должна учитываться. Вот только не понять зачем это нужно, если все гораздо проще сделать с fixed. | |
|
|
|
|
|
|
|
для: confirm
(30.11.2016 в 13:35)
| | fixed не совсем устраивает. Я пока так и сделал. Хочется чтоб это было при absolute.
Я с js очень плохо. Пожалуйста, напишите код как это рассчитать. | |
|
|
|
|
|
|
|
для: immortal727
(05.12.2016 в 10:34)
| | Поищите в сети, есть готовые и плагины, и уроки. Я конечно могу написать и пояснить, но нет у меня сейчас для этого свободного времени. | |
|
|
|
|
|
|
|
для: confirm
(05.12.2016 в 13:20)
| | Я перед тем как написать в форум уже много времени потратил на сети. И нигде не могу найти как это дело рассчитать. | |
|
|
|
|
|
|
|
для: immortal727
(05.12.2016 в 13:44)
| | В jQuey есть метод .scrollTop(), который возвращает значение прокрутки документа. Если вы при щелчке привязываете к этим координатам нечто, то чтобы "вклеить" в это место это нечто, нужно еще знать на сколько прокручен документ, иначе ваше нечто либо уплывет наверх, либо сползет вниз. | |
|
|
|