I'm trying to build a basic resizing script using just raw jQuery v1.5.1 (Script below). For some reason it throws the following error and won't continue with running the script.
This is being tested with Chrome, Mac OSX
Error
Uncaught TypeError: Cannot read property 'defaultView' of undefined
Code:
$(document).ready( function() {
/* Set initial #site width */
stretch_portal_content();
$(window).resize( stretch_portal_content );
});
function stretch_portal_content() {
alert($('#site').width());
$('#left-container').width(
$('#site').width()-150
);
if ($(window).height() > $('body').innerHeight()){
$('#site').height(
$(window).innerHeight()
);
}
}
Example HTML
<!DOCTYPE html5>
<html>
<head>
<title></title>
<link media="screen" rel="stylesheet" href="style.css" />
</head>
<body>
<div id="site">
<div id="left-container">
<div class="inner">
<ul id="grid">
<li>Story 1</li>
<li>Story 2</li>
<li>Story 3</li>
<li>Story 4</li>
<li>Story 5</li>
</ul>
</div>
</div>
<div id="right-container">
<ul id="category-list">
<li><a href="#">Category 1</a></li>
<li><a href="#">Category 2</a></li>
<li><a href="#">Category 3</a></li>
<li><a href="#">Category 4</a></li>
<li><a href="#">Category 5</a></li>
<li><a href="#">Category 6</a></li>
<li><a href="#">Category 7</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<script type="text/javascript" src="javascript/jquery.js"></script>
<script type="text/javascript" src="javascript/core.js"></script>
</body>
</html>
I'm trying to build a basic resizing script using just raw jQuery v1.5.1 (Script below). For some reason it throws the following error and won't continue with running the script.
This is being tested with Chrome, Mac OSX
Error
Uncaught TypeError: Cannot read property 'defaultView' of undefined
Code:
$(document).ready( function() {
/* Set initial #site width */
stretch_portal_content();
$(window).resize( stretch_portal_content );
});
function stretch_portal_content() {
alert($('#site').width());
$('#left-container').width(
$('#site').width()-150
);
if ($(window).height() > $('body').innerHeight()){
$('#site').height(
$(window).innerHeight()
);
}
}
Example HTML
<!DOCTYPE html5>
<html>
<head>
<title></title>
<link media="screen" rel="stylesheet" href="style.css" />
</head>
<body>
<div id="site">
<div id="left-container">
<div class="inner">
<ul id="grid">
<li>Story 1</li>
<li>Story 2</li>
<li>Story 3</li>
<li>Story 4</li>
<li>Story 5</li>
</ul>
</div>
</div>
<div id="right-container">
<ul id="category-list">
<li><a href="#">Category 1</a></li>
<li><a href="#">Category 2</a></li>
<li><a href="#">Category 3</a></li>
<li><a href="#">Category 4</a></li>
<li><a href="#">Category 5</a></li>
<li><a href="#">Category 6</a></li>
<li><a href="#">Category 7</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<script type="text/javascript" src="javascript/jquery.js"></script>
<script type="text/javascript" src="javascript/core.js"></script>
</body>
</html>
- Could you add example HTML so we can test it? Also what browsers does this error occur on? – Dave L. Commented Mar 28, 2011 at 0:00
- I've determined it's something below or including the "if" statement as on first run the code runs. – Xopa Commented Mar 28, 2011 at 0:01
- Ok, I know that's not the best way to word it. jQuery without plugins then? – Xopa Commented Mar 28, 2011 at 0:03
-
Your HTML doesn't have a
</html>. – Lightness Races in Orbit Commented Mar 28, 2011 at 0:24 -
You shouldn't drop the
{like that. Not only is it ugly, but it's not standard Javascript and is not universally supported (to the best of my knowledge). – Lightness Races in Orbit Commented Mar 28, 2011 at 0:25
1 Answer
Reset to default 4Inner Height Documentation
The issue is the innerHeight function is not applicable to the window object. Use height instead.
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744710117a4589293.html
评论列表（0条）