Thanks, that seems to have been the problem.
I have one other question, not sure if I should start a new thread for it, but on the page I have the video background become fixed at a certain scroll point, and use jQuery to change its height:
$(document).ready(function() {
if (!!$('.sticky').offset()) { // make sure ".sticky" element exists
var stickyTop = $('.sticky').offset().top; // returns number
$(window).scroll(function(){ // scroll event
var windowTop = $(window).scrollTop(); // returns number
var width = $(window).width();
var height = $(window).height();
if (stickyTop < windowTop && width > 960 ){
$('.sticky').css({ position: 'fixed', top: 0, marginTop: 20 });
$('.blog_single').css({ marginLeft: 260 });
$('.hiddenlogo').fadeIn(500);
$('#media_video_blog').fadeIn(500).css({ position: 'fixed', height: 100 });
$('.videoBG').fadeIn(500).css({ height: 95 });
}
else {
$('.sticky').css({ position: 'static', marginTop: 40 });
$('.blog_single').css({ marginLeft: 20 });
$('.hiddenlogo').css({ display: 'none' });
$('#media_video_blog').css({ position: 'static', height: 330 });
$('.videoBG').css({ height: 330 });
}
});
}
});
http://www.xnthony.com/html/index7.html
But the transition jumps when you scroll down. Is it possible to have the background video element become fixed at a precise point (100px height) so the transition is smoother? I’m pretty sure it is but not sure how I’d go about doing this…