Reputation: 931
I have a browser resize script:
$(document).ready(function() {
$(window).on('resize', function() {
if ($(this).height() <= 800) {
$('.content').css('max-height', '500px'); //set max height
}
else {
$('.content').css('max-height', ''); //delete attribute
}
}).resize()
})
I want to make the jscrollpane run after the window resizes because that is when I will need the scrollbar. At the current code I have it just shows the regular scrollbar.
$(function() {
$('.scroll-pane').jScrollPane();
});
Is there a way to run this script after the max height script is completed?
Upvotes: 0
Views: 764
Reputation: 17651
<script type="text/javascript">
$(document).ready(function() {
$(window).on('resize', function(){
if ($(this).height() <= 800){
$('.content').css('max-height', '500px'); //set max height
} else{
$('.content').css('max-height', ''); //delete attribute
}
$('.scroll-pane').jScrollPane(); //why not call it here?
}).resize()
})
</script>
Upvotes: 4
Reputation: 362
You're just calling a method here:
$('.scroll-pane').jScrollPane();
..JavaScript is perfectly capable of doing more things than just one within a single script block. You don't have to regard each action as a separate script.
So just put your method-call within the resize-event-handler, such as:
$(window).on('resize', function(){
if ($(this).height() <= 800){
$('.content').css('max-height', '500px'); //set max height
} else{
$('.content').css('max-height', ''); //delete attribute
}
$('.scroll-pane').jScrollPane(); // just call it here!
}
..and you're done.
It might be useful to read some articles about JavaScript. Or some books.
Some nice starting points:
http://www.w3schools.com/js/default.asp
http://www.codecademy.com/
Enjoy!
Upvotes: 0