2017-05-01 5 views
0

データを表示する方法はありますか?つまり、ユーザーがウェブサイトにアクセスすると、同じウェブサイトの2つまたは3つのリンクを変更した後、そこbottom.Isは、ユーザーが自分のwebsite.Belowの二、三のリンクを変更したときのdivを表示するにはどのような方法は、自分のコード特定のウェブサイトのリンク(アンカータグ)をクリックした後のデータを表示

$(document).scroll(function(e) { 
 
     e.preventDefault(); 
 
     var y = $(this).scrollTop(); 
 
     if (y > 800) { 
 
      $('.fadein-data').fadeIn(); 
 
     } else { 
 
      $('#close-data').click(function() { 
 
       $('.fadein-data').fadeOut(); 
 
       $(document).unbind('scroll'); 
 

 
      }) 
 

 
     } 
 
    });
.fadein-data { 
 
    display: none; 
 
    position: fixed; 
 
    width: 350px; 
 
    left: 20px; 
 
    bottom: 0; 
 
    border: 1px solid #e5e5e5; 
 
    border-bottom: 0; 
 
    padding: 30px; 
 
    background-color: #ffffff; 
 
    z-index: 1050; 
 
    -webkit-transform: translate3d(0, 0, 0); 
 
    -ms-transform: translate3d(0, 0, 0); 
 
    transform: translate3d(0, 0, 0); 
 
    box-shadow: 0 0.085em 0.5em 0 rgba(0, 0, 0, 0.165); 
 
} 
 
#close-data { 
 
    float: right; 
 
    font-size: 21px; 
 
    font-weight: 700; 
 
    line-height: 1; 
 
    color: #000; 
 
    text-shadow: 0 1px 0 #fff; 
 
    opacity: .2; 
 
    top: 5px; 
 
    position: absolute; 
 
    right: 9px; 
 
    cursor: pointer; 
 
}
<div class="fadein-data"> 
 
       <a type="button " id="close-data "><span aria-hidden="true ">×</span></a> 
 
       <h4 class="mt-0 mb-10 ">Heading</h4> 
 
       <p><b>The all in one software and some content</b></h4> 
 

 
        <img src="images/brochure.png "> 
 
        <br> 
 
        <a type="button " href="Brochure.pdf " class="btn btn-success">Download Brouchure</a> 
 
      </div>

です:

+0

「同じウェブサイトの2つまたは3つのリンクを変更した後」とは何ですか? – brk

+0

ユーザーが自分のウェブサイトにアクセスし、自分のウェブサイトにアクセスすることの関心を示している場合、私は隠れたdivを表示したい – muther

答えて

0

だから、表示を開始したいですよユーザーがすでにいくつかのリンクをナビゲートしていると、ここに一つの解決策があります。 あなたは

`$(window).on('hashchange', function(e){ 
// do something... 
});` 

イベントや (document).location().change イベントにコールバックをバインドすることができます。

コールバックでは、現在のURLをグローバルに定義された配列にプッシュし、配列の長さをチェックします。必要に応じて2または3以上の場合は、コールバックを起動してデータを表示します。近い例があります!

$(document).ready(function() { 
var navigatedUrls = []; 
$(window).bind('hashchange', function(e) { 
    var anchor = document.location.hash; 
    navigatedUrls.push(anchor); 
    if(navigateUrls.length >2) { 
     //call the method that displays data 
    } 
}); 
}); 

あなたのURLの仕方に基づいて、ハッシュと場所の部分を置き換えることができます。 hashchangeイベントをサポートしているブラウザのリストです。 http://caniuse.com/#feat=hashchange

関連する問題