ビジュアルコンポーザーのスティッキー行

Question

私は、ビジュアルコンポーザーページビルダーを使用してWordpressでサイトを作成しています。

私は、ページの一番上に行はスティッキーしたいと編集者にこのCSSを追加しました：

/* makes header bar sticky to top of page */ 
.sticky { 
    position: fixed; 
    top: 0; 
    z-index: 1; 
} 

と私はクラス名としてスティッキー追加されました。

これは機能しません。どこが間違っているのかわかりません。助けてください。あなたは、その行はヘッダを含むすべてのものを、オーバーラップする場合

おかげ

Answer 1

は、あなたはDOM内を移動し、ページの本文に追加しなければなりません。それ以外の場合は、親コンテナ内で固定されます。

上記ルートテーマフォルダ内の「jsの」ディレクトリに「私の-scripts.js」と呼ばれるファイルに保存され、あなたはあなたがワードプレスでjQueryライブラリAFTER適切に上記のコードを含めることができますと仮定

jQuery(document).ready(function(){ 
    if (jQuery(".sticky").length) { 
     jQuery(".sticky").appendTo("body");  
    } 
}); 

以下の機能を備えています。

function my_jquery_scripts() { 

    $PathToMyScript = get_stylesheet_directory_uri() . "/js/my-scripts.js"; 

    wp_register_script('my-jquery-js', $PathToMyScript, array('jquery'), time(), true); 
    wp_enqueue_script('my-jquery-js'); 

} add_action('wp_enqueue_scripts', 'my_jquery_scripts'); 

NB：あなたはブラウザがスクリプトをキャッシュしたい場合は、falseでtime()を交換してください。