parallax change text effects
I've been exploring Adobe Muse but I'm not very good with jQuery/JS. I'm
trying to recreate an effect where when scrolling a text is changing.
<script type="text/javascript">
$(document).ready(function() { try {
Muse.Utils.transformMarkupToFixBrowserProblemsPreInit();/* body */
Muse.Utils.prepHyperlinks();/* body */
$('#u74').registerPositionScrollEffect({"offset":-101,"speedX":0,"speedY":0.8});/*
scroll effect */
$('#u79-4').registerPositionScrollEffect({"exitSpeedY":1,"offset":169.85000000000002,"enterSpeedX":0,"enterSpeedY":0.7,"exitSpeedX":0});/*
scroll effect */
$('#u83').registerPositionScrollEffect({"offset":703.35,"speedX":0,"speedY":0.4});/*
scroll effect */
Muse.Utils.fullPage('#page');/* 100% height page */
Muse.Utils.showWidgetsWhenReady();/* body */
Muse.Utils.transformMarkupToFixBrowserProblems();/* body */
} catch(e) { Muse.Assert.fail('Error calling selector function:' + e); }});
</script>
<script>
$(window).bind('scroll',function(e){
parallaxScroll();
});
function parallaxScroll(){
var scrolled = $(window).scrollTop();
$('#u-test').text((0+(scrolled)));
}
</script>
function parallaxScroll() does what I want, it is just that it is not
bound to the actual scroll of the text in question, which is
$('#u83').registerPositionScrollEffect
Where should i put this piece of code in order to get the correct value
based on the parallax offset?
Here is the piece of html that drives this
<div class="clearfix" id="page"><!-- group -->
<div class="se_invi" id="u74"><!-- image -->
<img class="block" id="u74_img" src="images/test.jpg" alt=""
width="1383" height="2048"/>
</div>
<div class="clearfix se_invi" id="u79-4"><!-- content -->
<p>This is an AMAZING EXPERIENCE</p>
</div>
<div class="clearfix se_invi" id="u83"><!-- group -->
<div class="clearfix grpelem" id="u81-6"><!-- content -->
<p id="u81-2">PERCENTAGE</p>
<p id="u81-4">%</p>
</div>
<div class="clearfix grpelem" id="u82-4"><!-- content -->
<p id="u-test" style="width: 500px;">0</p>
</div>
</div>
<div class="verticalspacer"></div>
No comments:
Post a Comment