Parallax Background

Vertikální "parallax" efekt.

  • ianlunn.co.uk/articles/recreate-nikebetterworld-parallax

Instalace a nastavení

  1. https://www.drupal.org/project/parallax_bg
  2. Není možné přesné nastavení rychlosti, která je závislá na pozici obrázku ve stránce no

Další moduy:

  • Skrollr

Další řešení:

  • designers.hubspot.com/docs/snippets/design/implement-a-parallax-effect - Implement a Simple Parallax Effect yes
  • pixelcog.github.io/parallax.js - Simple Parallax Scrolling
    • vyžaduje jQuery Update modul
    • ...tpl.php
    • <?php
        //dpm($variables,"description");
        $tid = $variables['id'];
        $term = taxonomy_term_load($tid);
        $uri = $term->field_image[LANGUAGE_NONE][0]['uri'];
        //$file_uri_real = drupal_realpath($uri);
        $file_uri = file_uri_target($uri);
        $file_path = file_create_url(file_build_uri($file_uri));
        //print $file_path;
      ?>
      <div class="parallax-container" data-parallax="scroll" data-image-src="<?php print $file_path; ?>" data-natural-height="400">
      

Background Images Formatter | Dynamic Background | Field Group Background Image