Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 20.02.2015, 14:51
Новичок на форуме
Отправить личное сообщение для AlinaBeawer Посмотреть профиль Найти все сообщения от AlinaBeawer
 
Регистрация: 20.02.2015
Сообщений: 9

совсем я запуталась(( говорю же полный чайник.

вот код, где уже создано окно всплывающее $('.point'). значит его не надо снова создавать. ширину вычислять не надо, она уже есть - point.width т.к. всплывающее окно - ('<div />') с классом point

var point = this.getBBox(0);
$('#map').next('.point').remove();
$('#map').after($('<div />').addClass('point'));
$('.point')
.html(paths[arr[this.id]].name)
.prepend($('<a />').attr('href', '#').addClass('close').text('Закрыть'))
.prepend($('<img />').attr('src', 'http://srm76.ru/wp-content/themes/mychildthemeSRM76/karta/logo/'+arr[this.id]+'.png'))
 .css({    	
left: point.x+(point.width/2)-50,
top: point.y+(point.height/2)-20
})
.fadeIn();
});


Осталось понять в какое место кода всунуть код условия
.if(point.x + point.width > 920)left-= point.width))


и зачем задавать var left и передавать его в сцц - если оно уже есть в css - left: point.x+(point.width/2)-50, второй раз создать или из цсс убрать?
Ответить с цитированием
  #12 (permalink)  
Старый 20.02.2015, 15:52
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от AlinaBeawer
и зачем задавать var left и передавать его в сцц - если оно уже есть в css - left: point.x+(point.width/2)-50, второй раз создать или из цсс убрать?
Уффф. Прежде чем записывать left в css мы должны рассчитать его правильное значение, так? Че дергать элемент то туда-сюда, перезаписывая ему css?

Сначала мы в left записываем значение для отображения окошка справа.
Далее мы проверяем - а вместится ли в таком случае окошко? Если не вмещается - уменьшаем left на ширину окошка (то есть перемещаем окошко влево).

Короче:
Код:
лево = точка_нажатия
если (лево + ширина_окошка > 920) тогда
    лево = лево - ширина_окошка
конецЕсли
Или:
Код:
если (точка_нажатия + ширина_окошка <= 920) тогда
    лево = точка_нажатия
иначе
    лево = точка_нажатия - ширина_окошка
конецЕсли
Что тоже самое.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #13 (permalink)  
Старый 20.02.2015, 16:19
Новичок на форуме
Отправить личное сообщение для AlinaBeawer Посмотреть профиль Найти все сообщения от AlinaBeawer
 
Регистрация: 20.02.2015
Сообщений: 9

спасибо большое за потраченное время! логику я еще понимаю, а с синтаксисом не знакома. никогда не приходилось программировать. пойду разбираться.
Ответить с цитированием
  #14 (permalink)  
Старый 20.02.2015, 16:29
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Чтоб было понятней, надо записать так:
var $point = $('.point');

$point.html(...);
$point.prepend(...);

var left = /* вычисляем left */
var top = /* вычисляем top */

$point.css({left: left, top: top});
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #15 (permalink)  
Старый 20.02.2015, 16:34
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Надо все на переменные разбивать и делать последовательно и аккуратно. Тогда и понимание придет.
// где-то в самом начале скрипта или config.js или чем-то подобном
var mapDir = 'http://srm76.ru/wp-content/themes/mychildthemeSRM76/karta/logo/';

var $close = $('<a />', {href: '#', 'class': 'close', text: 'Закрыть'});
var $map = $('<img />', {src: mapDir + arr[this.id]+'.png'});

$point.prepend($close, $map);
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #16 (permalink)  
Старый 20.02.2015, 17:58
Новичок на форуме
Отправить личное сообщение для AlinaBeawer Посмотреть профиль Найти все сообщения от AlinaBeawer
 
Регистрация: 20.02.2015
Сообщений: 9

var $point = $('.point');
 

$point.html(...);

$point.prepend(...);

 

var left = point.x+(point.width/2)-50; /* вычисляем left или точку нажатия */
if((left+point.width)>920)left=(left-point.width) /*если..., то...*/
 
 

$point.css({/*задаем стиль*/
             left: left, 
             top: top
            });


так?
Ответить с цитированием
  #17 (permalink)  
Старый 20.02.2015, 19:09
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от AlinaBeawer
point.x+(point.width/2)
Да, только почему мы тут прибавляем половину ширины окошка?
В css свойство left - это позиция левой границы элемента, а не центра.
Или в стилях прописан отрицательный margin?

И вообще, point.width - это точно ширина окошка?
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Прокрутка всплывающего окна greatilya (X)HTML/CSS 15 18.06.2014 13:45
Определить адрес всплывающего окна maks1408 Events/DOM/Window 5 05.05.2014 19:39
По поводу всплывающего окна Popap tiksi jQuery 0 31.05.2013 04:22
Позиционирование всплывающего окна debugx jQuery 5 24.05.2011 15:47
script для всплывающего окна?????! BIZNES123 Элементы интерфейса 3 04.12.2009 10:43