Parallax scrolling to images

hey i am wondering if you know of a way to add parallax scrolling to image slide tumbnail slide shows ?
this is what i am working on. i am using the compostion lightbox display, and in there. i have a thumbanil slide show. nowi have managed to get that in there. with the triggors.
now. i am wanting to see if i can added thumbnail slides that when i hit the slide, it shows the next set of images.
example.
engagment| Bridal| wedding
its one slide show, but when you hit it. you can go to the next slide, like how you have slide 1, 2 and 3. that what i am thinking is what parallax scrolling is?
can it be done? if so how?

Thanks for your reply. I tried applying the following AS2 script to each image:
For the first movie clip I used:
animator = createEmptyMovieClip('animator',1);
bg_1 = animator.attachMovie('star1','bg_1',1);
bg_2 = animator.attachMovie('star1','bg_2',2);
bg_1._x = -bg_1._width/2;
bg_2._x = bg_2._width/2;
speed = 1;
starWidth = 950;
animator.onEnterFrame = function() {
    bg_1._x -= speed;
    bg_2._x -= speed;
    if(bg_1._x <= -bg_1._width) bg_1._x = starWidth;
    if(bg_2._x <= -bg_2._width) bg_2._x = starWidth;
For the second movie clip I used:
animator = createEmptyMovieClip('animator',2);
bg1 = animator.attachMovie('star2','bg1',1);
bg2 = animator.attachMovie('star2','bg2',2);
bg1._x = -bg1._width/2;
bg2._x = bg2._width/2;
speed = 2;
starsWidth = 950;
animator.onEnterFrame = function() {
    bg1._x -= speed;
    bg2._x -= speed;
    if(bg1._x <= -bg1._width) bg1._x = starsWidth;
    if(bg2._x <= -bg2._width) bg2._x = starsWidth;
And for the third and final movie clip I used:
animator = createEmptyMovieClip('animator',3);
bg01 = animator.attachMovie('star03','bg01',1);
bg02 = animator.attachMovie('star03','bg02',2);
bg01._x = -bg01._width/2;
bg02._x = bg02._width/2;
speed = 3;
starssWidth = 950;
animator.onEnterFrame = function() {
    bg01._x -= speed;
    bg02._x -= speed;
    if(bg01._x <= -bg01._width) bg01._x = starssWidth;
    if(bg02._x <= -bg02._width) bg02._x = starssWidth;
I thought this would work, but when I tested the movie all three movie clips moved together at the same speed. I want each movie clip to move at a different speed, but I'm completely stuck.

Similar Messages

Parallax scrolling + accordion - sliding in images on click?

Hey guys
I was wondering if there was anyway to combine elements of parallax scrolling to an accordion widget? I have different catagories of information, and when a particular accordion is clicked I'd like an image to appear with the text at a slightly slower speed than the accordion opening.
Is there a way to do this tidily? Thanks for any help.

Hi Nate and welcome!
One idea: you may accidentally have turned on zooming. Try pressing the control key as you use the scroll wheel on your mouse. Zoom out as far as it will go and release the control key.
Any better?

Image box with opacity gradients, and other parallax scrolling inhancements

First i want to say great job Muse Team, this is starting to get really interesting:
I've been playing around with parallax scrolling over gradients for effect,   but i'm dreaming about fading in full screen fields of texture.   without the weight of massive .png
1)      I would love to see the Background Image folder persist in the rectangle Fill > Gradient menu, with the options to tile etc.
2)     This feature along with speed and rotation controls for anchor finding, would really crack this thing wide open for me.
could be implemented with 2 lines coming off anchors:
one line straight down that can be rotated like a hand on a clock, to set the landing orientation.
and the second a diagonal line (thinking photoshop curves), to set the approach speed.
Maybe holding shift with the hand tool could rotate the design page, though i have no idea what rotation would do to the exhisting scrolling menu, i guess ill leave implementation to you!
3)     One last tweak, the option to remove scroll bars entirely from the page properties menu would be nice, but intil then i found this bit of code for the bleeding edge:
Insert as HTML to hide the horizontal scrollbar:
<style>
html,body{
overflow-x:hidden;
</style>
thanks for your time

Be sure your images are stacked properly in the order you need them in your Layers panel.
If that doesn't solve your problem please provide a link or screenshots so we can see your problem.

Photo gallery using parallax scrolling?

hey i have been testing out each of the slide show widgets in adobe muse. some of them are okay. the light box for once. is a challenge, but heres something i want to learn how to do. and its parallax scrolling with photos for a gallery. i think for what i am wanting to do i think its the best layout for me. heres a web site that hass it i think. http://album.alexflueras.ro/galleries/people.html#a1.
see i shows both landscape and portrait mode of photos. and thats been a challenge from the get go. so there i am thinking of using parallax scrolling . now how do i do this? is it done in photo shop and adobe muse. bec i do want to change out my i mages when needed?
now i am a tad bit curious. it looks good on desktop, but what about mobile devies. most phone. would it work great.?
so what are the steps for making this?
the other key thing i noticed. is that the photos are large. and thats what i like.
thanks

Hi
You can use composition on page where you can insert the images with scroll effect applied.
Check this video , its not exact design but will help to make images scroll page :
http://www.youtube.com/watch?v=BDgERSf2a5k
Thanks,
Sanjit

Discover New Parallax Scrolling with Adobe Muse CC | Creative Cloud for Design | Adobe TV

Terry White, Adobe worldwide evangelist, shows how Adobe Muse CC lets you create stunning effects with just a few clicks. Make images and elements move in different directions at different speeds when scrolling — all without writing code.
http://adobe.ly/12yzGv0

There has to be a way to create a Re: Discover New Parallax Scrolling with Adobe Muse CC | Creative Cloud for Design | Adobe TV slideshow that fills browser width. It's not a problem for desktop, but it is a problem for laptops/tablets/phones.
How did the site in the tutorial do it? Terry said it was created in Muse.
Here is a test site that I've been working on - I would love to make it responsive w/o having to create separate tablet/phone sites:
http://mandm.businesscatalyst.com
Any suggestions?

Problem with parallax scrolling moving around randomly

I have an ipad air. My problem is with the parallax scrolling. It just seems to be moving randomly around the screen even when the ipad is steady and it's quite difficult to get the ipad to change orientation when I stand it on its side. I've reset the ipad and turned it on and off a few times. Has anyone been having this problem and know how to fix it. I know you can turn it off but I don't really want to.

Hi there
I am experiencing the exact same problem with my Ipad Air. Did you manage to find a solution yet? Im hoping it isnt a hardware problem either. Orientation not really co-operating. Background image moving around the whole time as if trying to settle, even when device dead still?!
Please do let me know
Thanks
Greg

100% Height with Parallax Scrolling?

I have an anchor point style parallax scrolling, I was wondering if I could have 100% height of my slideshow or image background when i maximize my screen, as you can see their is a white space below it that I do not like
http://i.imgur.com/AryW4v1.jpg

Hi,
As of now, Muse does not offer the option of 100% height objects. You can use the fullscreen slideshow widget if you want the image slideshow across your complete page.
Also, Please post this as a feature request at Ideas for features in Adobe Muse
Hope this helps
Regards,
Rohit Nair

Can I import CSS & Javascript to Parallax Scrolling?

Hi
I have an example of Parallax Scrolling which gives the image the illustion of colour change on each slide. A simple example is shown here:
http://dev.creemama.com/krystalrae-scroll-effect
I have tried to achieve this using basic Parallax Scrolling in Muse, but is does not work as effectively as the sample. Another example is shown here:
http://krystalrae.com/2013/fall
I asked the developer how he achieved this and he said they used simple CSS and Javascript. I have tried putting the CSS Code and the Javascript code into muse - but it doesn't work. Is it possible to put code (other than Google maps) into muse to get the above effect?
I would be most grateful if anyone can help with this - I am sure it must be possible in Muse.
Many thanks
Deborah K

user7488239 wrote:
Hi ,
I have one APEX application , now I have need import one javascript file to this application as static file in shared components .can I use sqlplus to upload this file to the application.
Thank you . George
Yes you can given that your source and target workspace have same name & id, basically you can export/import any files (images, css and static files)
You can export individual static files and they can be imported only through SQL*PLUS
See http://docs.oracle.com/cd/E37097_01/doc/doc.42/e35125/deploy_export.htm#HTMDB25824

Parallax Scrolling from top view (bird view)/ resizing and blank spots

Hello : )
I was thinking this was going to be easy but some problems occurred
Currently Im trying to make a parallax scrolling road while seeing it from above, but there are some issues going on.
the 1st one is that somehow after the second image is gone out of the stage , there are a few blan pixels that are not filled .... and it seems that the speed of the moving is == to the pixels that aren't filled up.
And i think , just asume that if i test this on like different screen sizes - lets say this is for a phone - ill get some issues with the scaleX and Y and it will get quite ugly and cubic.
I did surch for an example or a tutorial but there are only in a X direction like if you see the car from a side view like this
http://hub.tutsplus.com/tutorials/add-depth-to-your-game-with-parallax-scrolling--active-2 134
the SWF file si here
http://www.stouchgames.com/APKs/Road.swf
so the current code i have is
package {
          import flash.display.MovieClip;
          import flash.events.Event;
          public class MainClass_road extends MovieClip {
                    protected var _road:road = new road();
                    protected var _road2:road2 = new road2();
                    public function MainClass_road() {
                              _road.x = stage.stageWidth/2
                              _road.y = stage.stageHeight - _road.height
                              addChild(_road)
                              _road2.x = stage.stageWidth/2
                              _road2.y = y - _road2.height
                              _road2.alpha = 1
                              addChild(_road2)
                              addEventListener(Event.ENTER_FRAME, everyFrame)
                    protected function everyFrame(ev:Event):void{
                              _road.y +=8
                              if(_road.y > 400){
                                        trace("zzzz")
                                        _road.y = y - _road2.height
                              moveBackground2()
                    protected function moveBackground2(){
                              _road2.y +=8
                              if(_road2.y > 400){
                                        _road2.y = y - _road2.height
and the FLA is here
http://www.stouchgames.com/APKs/Road.fla

is there a way to do this only with only as3 code and not by this way :
if the road high graphics are 400 pixels and the stage has 400 height
1.creating the original _road and setting it`s Y to 0
2.go in the same movieClip (of the _road) copy and paste the same graphics but at Y = -400
and then adding the code
               var speed = 4
               var _road:road = new road();
               _road.x = stage.stageWidth/2
                              _road.y = y
                              addChild(_road)
               addEventListener(Event.ENTER_FRAME, everyFrame)
function everyFrame(ev:Event):void{
               _road.y += speed
               if(_road.y > 400 ){
                   trace("zzzz")
                   _road.y = y
cause it seems (for me )that if i do it with code only - there is a blank spot which amount is the speed in the EveryFrame function
and if no ... can i make it smoother without changing the framerate above 30

Parallax Scrolling Problem

Hi,
I followed some instructions on this forum to build up my parallax scrolling scene by Edge Animate 1.5.
The layers of scene do move 'parallaxly' with the mouse scrolling,but do not follow the keyframes set up on the timeline,
which should stop at the same time by their right edges aligned with the right end of the stage. Please have a look of my source code and the html file:
https://docs.google.com/file/d/0B-XfhbCUQZ8RM21iUFJIRFZVWEU/edit?usp=sharing
Many thanks for help!
Eric

Hi there
I am experiencing the exact same problem with my Ipad Air. Did you manage to find a solution yet? Im hoping it isnt a hardware problem either. Orientation not really co-operating. Background image moving around the whole time as if trying to settle, even when device dead still?!
Please do let me know
Thanks
Greg

Parallax scrolling problem since updating to Muse 7.1 and republishing my site

Hi.
I recently updated my Muse application to Version 7.1, made a few text changes to my site and republished my site, since I did this the following happens:
The parallax scrolling feature i have on my template moves the background images slowly to the right as you scroll for top to bottom.
I don't want it to do this, is this a bug in the 7.1 build of Muse of is there something I can do to stop this happening?
Also, the first background image you see when you land on the site seems to have repositioned itself within the frame to a different part of the image when published, see here the actual Muse document page, which is how it should look:
To see how it now looks 'live' see the link below...
www.jumatwo.com
any help resolving this would be much appeciated.
Thank You.

We had this where I work on ~200 machines.
We are still going around manually clicking the sharing>remote management tickboxes off and on as this fixes it.
It seems the GUI is not reflecting what is behind the scenes.

Parallax Scrolling is Shakey

Hello-
First and foremost--- GREAT UPGRADE WITH 5.0! Love the Layers and the Parallax! I now have the hang of designing with the new scolling options, but I am noticing a serious shaking of the images that scroll slowly. It also seems to get worse the longer you view the same page, which is problematic since I am buidling a site that is all one long page.
You can see the problem at cordphillips.com -- if you hit the initial logo, it will scroll you down to the Black and White picture I am referring to. Is there any way to resolve this issue?
As always, thanks and best,
-Cord

Hi Everyone,
We are glad that we came up with the solution of the Parallax Scrolling Problem that occurs on the scrolling with the mouse wheels (layers laggings) and jerk in the layers movement while scrolling with the mouse wheel. Just add the below mentioned code and set the time and distance to be covered in one scroll and done! You are good to go then.
Add this code in the index.html file's head tag
<script type="text/javascript">
if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;
var time = 1300;
var distance = 100;
function wheel(event) {
    if (event.wheelDelta) delta = event.wheelDelta / 120;
    else if (event.detail) delta = -event.detail / 3;
    handle();
    if (event.preventDefault) event.preventDefault();
    event.returnValue = false;
function handle() {
    $('html, body').stop().animate({
        scrollTop: $(window).scrollTop() - (distance * delta)
    }, time);
$(document).keydown(function (e) {
    switch (e.which) {
        //up
        case 38:
            $('html, body').stop().animate({
                scrollTop: $(window).scrollTop() - distance
            }, time);
            break;
            //down
        case 40:
            $('html, body').stop().animate({
                scrollTop: $(window).scrollTop() + distance
            }, time);
            break;
</script>

Parallax scrolling does't seem to work consistently?

Hi All,
I've been pulling my hair out for a few days now trying to get parallax scrolling to work consistently (FAIL)
Have a look at this and see if it me or just Muse doing something wrong:
www.bbr.co.nz/testing2
and these screen shots of the muse file?
what gives?

Perfect... simple making sure the 'page' before the parallax scrolling element has no text boxes that are smaller than the copy filling them seem to fix the problem
Before image with the dotted line (box to small):
After image with box pulled down to make sure dotted line disapears:
Strange glitch but all good now
Cheers for you help Razvan

Parallax scrolling effect

Does anybody know how I can achieve the effect below with parallax scrolling in Adobe Muse? In the example below there is one illustrated image and another photograph, and when scrolling it looks like the illustration is being colored.

Please check out the Browser Fill section of the Scroll Effects article from below link.
Scroll Effects using Browser Fill
Here is what I managed in Muse playing around with the same: http://colorfill.businesscatalyst.com/index.html
You can download the source file for the same from: http://colorfill.businesscatalyst.com/assets/colorfill.muse
Hope that helps.
Cheers,
Vikas

Parallax scrolling element on the iPad

My site doen's publish in the ipad if i have a parallax scrolling element, it disappears compleetley.
You see it for a second and than you get a banco page.
I didn't make a itablet version, becouse i want elements that stuck to the position, and figured out that that is nt posible on the tablet version. That works fine on my iPad.
So why doen't he show my parallax scrolling element?

http://uitdekeldervanfloris.businesscatalyst.com
But I removed the scolding option now.
Verstuurd vanaf Fleur Westendorp 's iPad
Op 18 nov. 2013 om 21:00 heeft "Vikas.Sharma" <[email protected]> het volgende geschreven:
Re: Parallax scrolling element on the iPad
created by Vikas.Sharma in Help with using Adobe Muse CC - View the full discussion
Could you please share your site URL to check.
Thanks,
Vikas
Please note that the Adobe Forums do not accept email attachments. If you want to embed a screen image in your message please visit the thread in the forum to embed the image at http://forums.adobe.com/message/5852317#5852317
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: http://forums.adobe.com/message/5852317#5852317
To unsubscribe from this thread, please visit the message page at http://forums.adobe.com/message/5852317#5852317. In the Actions box on the right, click the Stop Email Notifications link.
Start a new discussion in Help with using Adobe Muse CC at Adobe Community
For more information about maintaining your forum email notifications please go to http://forums.adobe.com/thread/416458?tstart=0.

Parallax scrolling to images

Similar Messages

Maybe you are looking for