尝试在服务器上运行turn.js时出现以下错误。在我的本地机器上通过浏览器它完美地工作。当我尝试在服务器上部署它时,我的问题就出现了。
我使用的是基本示例文件夹中提供的相同basic.js和basic.css代码。我有一个服务器路径到框架中的所有turn.js文件。我只将yepnope部分中的三个文件的路径更改为服务器路径。 jquery和modernizr通过服务器引用。我可以看到所有的js和css文件都是从服务器加载到浏览器中的。
错误:
TypeError: parent.offset(...) is null
data.fwrapper = $('<div/>', divAtt(parent.offset().top, parent.offset().left)).
HTML CODE:
<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]-->
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
<head>
<meta name="viewport" content="width = 500, user-scalable = no" />
</head>
<body>
<div class="flipbook-viewport">
<div class="container">
<div class="flipbook">
<div> Turn.js </div>
<div> Page 1 </div>
<div> Page 2 </div>
</div>
</div>
</div>
<script type="text/javascript">
function loadApp() {
// Create the flipbook
$('.flipbook').turn({
// Width
width:922,
// Height
height:600,
// Elevation
elevation: 50,
// Enable gradients
gradients: true,
// Auto center this flipbook
autoCenter: true
});
}
// Load the HTML4 version if there's not CSS transform
yepnope({
test : Modernizr.csstransforms,
yep: ['/apps/chacha/components/content/flipbook/clientlibs/js/turn.js'],
nope: ['/apps/chacha/components/content/flipbook/clientlibs/js/turn.html4.min.js'],
both: ['/apps/chacha/components/content/flipbook/clientlibs/css/basic.css'],
complete: loadApp
});
</script>
</body>
</html>