Показать сообщение отдельно
  #1 (permalink)  
Старый 30.05.2014, 14:31
Новичок на форуме
Отправить личное сообщение для pleymo Посмотреть профиль Найти все сообщения от pleymo
 
Регистрация: 27.05.2014
Сообщений: 6

Всплывающее окно / Позиционирование
День добрый

Проблема с всплывающим окном, скрипт и стили писал не я, были взяты с сайта скрипта, отцентровал в стилях под сайт, чтобы тенью закрывало только страницу, потом взглянул на другом мониторе, там перекос, собственно если менять окно браузера в ширину и высоту, то фрейм с тенью также меняют свое месторасположения, можно ли как-то устаканить фрейм стоять на одном месте, в мой случае в пределах страницы?

Страница сайта со скриптом, при нажатии на участника со стрелкой открывается описание

http://artframeexpo.ru/?page_id=90

Код скрипта:

// Defining our jQuery plugin
$.fn.paulund_modal_box = function(prop){
// Default parameters
var options = $.extend({
height : "250",
width : "500",
title:"JQuery Modal Box Demo",
description: "Example of how to create a modal box.",
top: "140px",
left: "168px",
},prop);
//Click event on element
return this.click(function(e){
add_block_page();
add_popup_box();
add_styles();
$('.paulund_modal_box').fadeIn();
});
/**
* Add styles to the html markup
*/
function add_styles(){
$('.paulund_modal_box').css({
'position':'absolute',
'left':options.left,
'top':options.top,
'display':'none',
'height': options.height + 'px',
'width': options.width + 'px',
'border':'1px solid #fff',
'box-shadow': '0px 2px 7px #292929',
'-moz-box-shadow': '0px 2px 7px #292929',
'-webkit-box-shadow': '0px 2px 7px #292929',
'border-radius':'10px',
'-moz-border-radius':'10px',
'-webkit-border-radius':'10px',
'background': '#cccccc',
'z-index':'50',
});
$('.paulund_modal_close').css({
'position':'relative',
'top':'-10px',
'left':'27px',
'float':'right',
'display':'block',
'height':'50px',
'width':'50px',
    'background': 'url([url]http://artindustry.ru/expo/closebox.png[/url]) no-repeat',
});
/*Block page overlay*/
var pageHeight = $(window).height();
var pageWidth = $(window).width();
$('.paulund_block_page').css({
'position':'absolute',
'top':'270px',
'left':'544px',
'background-color':'rgba(0,0,0,0.6)',
'height': '1030px',
'width': '1038px',
'z-index':'1'
});
$('.paulund_inner_modal_box').css({
'background-color':'#F7FDFA',
'height':(options.height - 50) + 'px',
'width':(options.width - 50) + 'px',
'padding':'10px',
'margin':'15px',
'border-radius':'10px',
'-moz-border-radius':'10px',
'-webkit-border-radius':'10px'
});
}
/**
* Create the block page div
*/
function add_block_page(){
var block_page = $('<div class="paulund_block_page"></div>');
$(block_page).appendTo('body');
}
/**
* Creates the modal box
*/
function add_popup_box(){
var pop_up = $('<div class="paulund_modal_box"><a href="#" class="paulund_modal_close"></a><div class="paulund_inner_modal_box"><h2>' + options.title + '</h2><p>' + options.description + '</p></div></div>');
$(pop_up).appendTo('.paulund_block_page');
$('.paulund_modal_close').click(function(){
$(this).parent().fadeOut().remove();
$('.paulund_block_page').fadeOut().remove();
});
}
return this;
};

$('.paulund_modal_1').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Imex»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Imex is one of European largest mouldings producer and foremost supplier to the framing industry. We produce mouldings both in wood and in MDF. Our customers are all manufacturers, producers of framed products.</p>',
height: '300',
width: '700'
});
    
$('.paulund_modal_2').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Арт-Профиль»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Компания «Арт-Профиль» была создана на базе компании «Богемия-Белгород», которая ведет свою историю от первой багетной мастерской города.<br></br>Сегодня компания «Арт-Профиль» поставляет на Российский рынок товары для артиндустрии, пластиковый багет израильского, корейского и литовского производства, высококачественный паспарту производства компании <b>«Royal Moorman Karton»</b> (Голландия), различную фурнитуру для производства багетных рам и фоторамок. В коллекции багета представлены образцы разных стилей от классики до модерна.<br></br>За время работы компания «Арт-Профиль» зарекомендовала себя, как надежный партнер, поставляющий качественную продукцию в широком ассортименте и по разумным ценам. Мы осуществляем поставки оптом в различные регионы страны, постоянным клиентам предоставляем особые условия и гибкую систему скидок.</p>',
height: '560',
width: '700'
});    
    
$('.paulund_modal_3').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Артэ»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Оптовая продажа и производство художественной продукции и багета.</p>',
height: '250',
width: '700'
});     
  
$('.paulund_modal_4').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Дизайн-Интер-Трейд»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Компания «Дизайн-Интер-Трейд» занимается оптовыми поставками рамного и интерьерного багета, картона для паспарту и оборудования для багетных мастерских, производством овальных рам и подрамника. Работает на рынке России с 1998 года. Имеет собственную сеть региональных складов - Тольятти, Санкт-Петербург, Екатеринбург, Кемерово, Пермь, Минск.</p>',
height: '350',
width: '700'
});      

$('.paulund_modal_5').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Галеон-Трейд»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Оптовая и розничная продажа багета, фурнитуры, оборудования для производства картин и фоторамок. Продажа картин и фоторамок.</p>',
height: '280',
width: '700'
}); 

$('.paulund_modal_6').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Интерквадрум»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Компания InterQuadrum первой в России организовала производство художественного багета из хвойных пород дерева. Конечная отделка с использованием самых современных итальянских технологий, оборудования и материалов осуществляется в ближнем Подмосковье. Качество багета подтверждается признанием зарубежных коллег из Европы, которые в 2004 году приянли InterQuadrum в ряды профессиональной организации европейских производителей багета EMMA.<br></br>Помимо производства собственного багета компания занимается импортом из Италии, Испании и Чехии.</p>',
height: '470',
width: '700'
}); 
    
$('.paulund_modal_7').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Ramastudio»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Багетная мастерская, дизайн и изготовление рам, изготовление копий рам, изготовление овальных и круглых рам, реставрация рам, продажа испанского багета оптом и в розницу.</p>',
height: '300',
width: '700'
}); 

    
$('.paulund_modal_8').paulund_modal_box({
    title:'<span style="margin-left:20px; margin-right:20px; text-decoration: underline; color: #A81F1A">«Bures Art»</span>',
    description:'<p style="margin-left:20px; margin-right:20px; margin-top: 40px;"><strong>Описание:</strong></p><p style="text-align: justify; margin-left:20px; margin-right:20px;">Продажа и репродукция картин.</p>',
height: '250',
width: '700'
});
Ответить с цитированием