Nice one Rob, going to check that out when I get the chance.
Printable View
Nice one Rob, going to check that out when I get the chance.
Hi,
Please see file here: Attachment 109673
Thanks
Rob
i like how it's auto-scalable from the get-go. only drawbacks (at least for me) is not being able to test it off-line as stated in the plug-in description coupled with the fact that it's only for youtube videos.
all in all it's a clean process and was easy to incorporate. nice find and share Rob. yet another bookmark. thx
I gave this a go but it doesn't seem to get on well with stickies. The background video is ok but other page elements end up displaying over my sticky header instead of the other way around. Also it looks like embedding youtube videos with default iframe code makes them appear over stickies too.
Edit: just discovered if you set the option wrapperZIndex to a lower number like 1 it seems to work ok with stickies.
Code:<script>
$('document').ready(function() {
var options = { videoId: 'ab0TSkLe-E0', start: 3, wrapperZIndex: 1 };
$('#xr_xr').tubular(options);
// f-UGhWj1xww cool sepia hd
// 49SKbS7Xwf4 beautiful barn sepia
});
</script>
Hi Rob-Xar, your 'attempt' is brilliant! Just what I am looking for. http://robert74.magix.net/video-background/
Could you please explain to me in really easy, step by step idiot's language how you did that?
Many thanks Teeser
hmmm. did you follow the link that is in his example that you quoted ^
it takes you to the plug-in developer's page. (and you need an editor like notepad++ or sublime)
copy paste steps 1 and 2, find the end </head> in your index.htm and copy it just before it
copy step 3 just before the end </body> in your index.htm between a <script> </script> blockCode:<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="index_htm_files/jquery.tubular.1.0.js"></script>
</head>
on the left under downloads, dl the tubular zip and in the js folder copy the jquery.tubular.1.0.js file to your index_htm_files folderCode:<script>
$('document').ready(function() {
var options = { videoId: 'w7JrHIHi8t0', start: 0 };
$('#xr_xr').tubular(options);
// f-UGhWj1xww cool sepia hd
// 49SKbS7Xwf4 beautiful barn sepia
});
</script>
</body>
now, find the youtube video id you want to use and copy it to the videoID from his step 3 (the part you copied to the <body>)
should be good to go from there
Hi mikeymopar, thanks for that. Scary... I'll give it a go. Watch this space. :-)
I think this is a good Xara example> http://xaratemplates.com/vendors/xar...xt93-template/
It completely breaks in IE8, they need to add a IE conditional comment for their background video.
Come on Michal you can do better than that!