User Tools

Site Tools


res:plugins:dynamicfadein

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
res:plugins:dynamicfadein [2025/05/11 23:03] – [Fade-in behavior] fraenkimanres:plugins:dynamicfadein [2025/05/12 12:38] (current) – [Download] fraenkiman
Line 8: Line 8:
  
 The plugin works with any theme/style that uses the Leggero theme templates. The plugin works with any theme/style that uses the Leggero theme templates.
 +
 +Demo: [[https://frank-web.dedyn.io|]]
 ==== Fade-in behavior ==== ==== Fade-in behavior ====
 {{:res:plugins:frank:dynamicfadein.png?480|Screenshot of the edit area with the CKEditor toolbar (Open-Source-Version)}} {{:res:plugins:frank:dynamicfadein.png?480|Screenshot of the edit area with the CKEditor toolbar (Open-Source-Version)}}
Line 46: Line 48:
 **Perceived performance** **Perceived performance**
  
- Faster visible header already at DOM-Ready increases the feeling that the page loads quickly.+  * Faster visible header already at DOM-Ready increases the feeling that the page loads quickly.
  
 **Optimized for specific networks and devices** **Optimized for specific networks and devices**
  
- Fade duration and delay automatically adapt to connection speed (fast/medium/slow) and device instead of triggering the same, often too long “one-size-fits-all” effect everywhere.+  * Fade duration and delay automatically adapt to connection speed (fast/medium/slow) and device instead of triggering the same, often too long “one-size-fits-all” effect everywhere.
  
 **Reduced distraction for returners** **Reduced distraction for returners**
  
- As soon as it is recognized that someone already knows the page, “Delay” is eliminated and content fades in even more quickly.+  * As soon as it is recognized that someone already knows the page, “Delay” is eliminated and content fades in even more quickly.
  
 **Lazy loading effect** **Lazy loading effect**
  
- Only when the actual post container enters the viewport does it start to fade in. This keeps the first impression lean and does not overload it with all the content at once.+  * Only when the actual post container enters the viewport does it start to fade in. This keeps the first impression lean and does not overload it with all the content at once.
  
 **Accessibility & respect for user preferences** **Accessibility & respect for user preferences**
  
- For bots, with “Save-Data” or prefers-reduced-motion, animations are skipped completely so that no obstacles or unnecessary traffic are created.+  * For bots, with “Save-Data” or prefers-reduced-motion, animations are skipped completely so that no obstacles or unnecessary traffic are created.
  
 **Fallback security** **Fallback security**
  
- IntersectionObserver polyfill and simple time delays ensure that older browsers reliably show at least a timed fade-in effect.+  * IntersectionObserver polyfill and simple time delays ensure that older browsers reliably show at least a timed fade-in effect.
  
 **Increasing engagement** **Increasing engagement**
  
- The gentle dragging in of content has a modern look and invites users to read on - users stay on the page longer.+  * The gentle dragging in of content has a modern look and invites users to read on - users stay on the page longer.
  
 ==== Download ==== ==== Download ====
-{{ res:plugins:frank:dynamicfadein1_1_0.zip|}}+{{ res:plugins:frank:dynamicfadein1_1_0.zip|}} | FlatPress 1.3 Andante or higher 
  
 ===== Changelog ===== ===== Changelog =====
res/plugins/dynamicfadein.1746997380.txt.gz · Last modified: by fraenkiman

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki