Wordpress - 视差效果

时间:2014-07-21 19:20:36

标签: wordpress wordpress-plugin parallax

我想在wordpress中实现视差效果,类似于marcfitt.com。向下滚动时,旋转木马会保持固定状态,下部内容会向上滚动。我怎样才能实现类似的东西呢?

1 个答案:

答案 0 :(得分:0)

此博客提供了有关为您的网站添加视差的分步指南:http://wevostudio.com/wordpress-parallax-implementation/

 <?php

    function add_theme_scripts() {

        wp_enqueue_script( 'parallax', get_template_directory_uri() . '/js/jquery.parallax-1.1.3.js', array(), '1.1.3', true );

                    wp_enqueue_script( 'nicescroll', get_template_directory_uri() . '/js/jquery.nicescroll.min.js', array(), '3.5.1', true );

    }

    add_action( 'wp_enqueue_scripts', 'add_theme_scripts' );

?>

<?php
    function custom_post_type() {
        $labels = array( 
            'name'               => _x( 'Parallax', 'general name' ),
            'singular_name'      => _x( 'Page', 'singular name' ),
            'add_new'            => _x( 'Add New', 'parallax' ),
            'add_new_item'       => __( 'Add New Page' ),
            'edit_item'          => __( 'Edit Page' ),
            'new_item'           => __( 'New Page' ),
            'all_items'          => __( 'All Pages' ),
            'view_item'          => __( 'View Page' ),
            'search_items'       => __( 'Search Pages' ),
            'not_found'          => __( 'No pages found' ),
            'not_found_in_trash' => __( 'No pages found in the Trash' ),
            'parent_item_colon'  => '',
            'menu_name'          => 'Parallax'
        );
        $args = array( 
            'labels'        => $labels,
            'public'        => true,
            'menu_position' => null,
            'supports'      => array( 'title', 'editor', 'thumbnail', 'excerpt', 'comments', 'page-attributes' ),
            'has_archive'   => true,
        );
        register_post_type(__( 'parallax' ), $args); 
    }
    add_action( 'init', 'custom_post_type' );
?>