Собственно, есть вот такая конструкция:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ru-RU">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="/css/normalize.css" />
<link rel="stylesheet" type="text/css" href="/css/default.css" />
<link rel="stylesheet" type="text/css" href="/css/overlay.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>
</head>
<body>
<div class="services-item">
<ul>
<li><a href="/services/" rel="#overlay">Services</a></li>
</ul>
</div>
<div id="overlay">
<div id="content-wrap"></div>
</div>
<script>
$(function() {
$("a[rel]").overlay({
mask: '#211d1b',
effect: 'apple',
onBeforeLoad: function() {
var wrap = this.getOverlay().find("#content-wrap");
wrap.load(this.getTrigger().attr("href"));
}
});
});
</script>
</body>
</html>
CSS:
#overlay {
display:none;
background:url(/img/overlay-bg.png);
width:1024px;
padding:35px;
font-size:11px;
}
#overlay .close {
background-image:url(/img/close.png);
position:absolute; right:5px; top:5px;
cursor
ointer;
height:35px;
width:35px;
}
Всё прекрасно работает, только скроллится страница, а не контент в оверлее. Возможно ли каким-то образом реализовать вертикальный скроллинг в оверлее в данном случае ? jScrollPane ?
