: What file format for browser-friendly animation, e.g., on Dropbox homepage? I noticed that the left half of Dropbox's homepage includes an animation (a fairly slow-paced one), with: gradually-revealed

I noticed that the left half of Dropbox's homepage includes an animation (a fairly slow-paced one), with:

gradually-revealed complex drawing, such as a "handwriting" animation
cross-compatibility across a bunch of browsers that I tested
fast loading time

When I right-click and try to open it in a new tab, it opens a PNG and not a GIF, and only shows the still portion of the "animation".

What is used to create this type of animation? Javascript? CSS3? Canvas-based?

10.02% popularity Vote Up Vote Down

: Critique Request: Very Generalized Catering Logo Update: First Try: I used the advice here and went back to the drawing board, wracking my brain for some creativity with this name and developed:

@Shakeerah625

Posted in: #Critique #Logo

5 Comments

: Templates / variable length text / consistent spacing vs. consistent space I have a template (for multiple pages in a brochure) which includes a block of text (squarish, fixed dimensions per

@Shakeerah625

Posted in: #PrintDesign #TemplateDesign

1 Comments

: Photoshop CS5 - How to assign position and dimensions from one object to another? I am currently updating an old document that I don't recall how I created the first time around. What I would

@Shakeerah625

Posted in: #AdobePhotoshop #Cs5

1 Comments

: How do I keep the spaces in my dashed line from changing when I modify the line length in Illustrator? Using Adobe Illustrator CS6, I drew a line and clicked the "Dashed Line" option in the

@Shakeerah625

Posted in: #AdobeIllustrator #HowTo #IllustratorEffects #Path #Stroke

2 Comments

Login to post a comment!

2 Comments

Sorted by latest first Latest Oldest Best

@Dunderdale640

Here is solution from Adobe (Edge Animate) for creation of JS animations with Flash-like workflow. Then animation can be embedded in any HTML page.
helpx.adobe.com/creative-cloud/learn/tutorials/animate.html

10% popularity Vote Up Vote Down

@Caterina889

There are a few things taking place on that Dropbox home page.

There is a stack of images, both png and svg, aligned with CSS. Then Javascript, specifically jQuery, is used to show/hide and animate the images.

The static image you get when you try and save it, is the default background for everything going on above the background.

Inspecting the code of the page may reveal more:

10% popularity Vote Up Vote Down

Feed

: What file format for browser-friendly animation, e.g., on Dropbox homepage? I noticed that the left half of Dropbox's homepage includes an animation (a fairly slow-paced one), with: gradually-revealed

More posts by @Shakeerah625

: Critique Request: Very Generalized Catering Logo Update: First Try: I used the advice here and went back to the drawing board, wracking my brain for some creativity with this name and developed:

: Templates / variable length text / consistent spacing vs. consistent space I have a template (for multiple pages in a brochure) which includes a block of text (squarish, fixed dimensions per

: Photoshop CS5 - How to assign position and dimensions from one object to another? I am currently updating an old document that I don't recall how I created the first time around. What I would

: How do I keep the spaces in my dashed line from changing when I modify the line length in Illustrator? Using Adobe Illustrator CS6, I drew a line and clicked the "Dashed Line" option in the

Login to post a comment!

2 Comments

Back to top | Use Dark Theme