I have been looking for a way to make objects move horizontally on vertical scrolling. I found this great answer from plugin's author. So the code to move things horizontally looked something like this:
$.stellar.positionProperty.apple = {
setTop: function($el, newTop, originalTop) {
$el.css({
'top': newTop,
'left': $el.hasClass('apple') ? originalTop - newTop : 0
});
},
setLeft: function($el, newLeft, originalLeft) {
$el.css('left', newLeft);
}
};
The issue with this is that it only covers horizontal scrolling from the left side. But it also affects another elements, even if they don't have the apple class from the example script. So if I have an image for example:
<section>
<img></img>
</section>
Where image is absolute
positioned and right:0;
as soon as you add data-stellar-ratio
to it, this script will push the element to the left side, even if the image haven't the class "apple"
Is there any way to define on the script that images with class "left" scrolls from left and then images with class "right" scrolls from the right hand side?