2

私のサイト: http://alsite.com.br/solalev/ページの下部にクリックできない要素がいくつかあります。要素の上には、push と呼ばれる div があります。この div を使用して、コンテンツが小さい場合でもフッターが常にページの下部にとどまるようにします... (これを正しく行うかどうかはわかりません..しかし、うまくいきました)..

だから.. ChromeとFirefoxではクリックできません.. しかし、IEではこれが機能します....

私はこれを使用します:

.push{
    pointer-events: none;
}

しかし、何も起こりません...

4

4 に答える 4

3

pointer-events: none;CSSでこれほど多く使用している理由はありますか?そうでない場合は、これが問題の原因であるため、それを取り除くだけです。

もう少し詳しく見てみると、問題は.wrapperdivです。.push divの高さは231pxで、.wrapperのmargin-bottomは-231pxで、スティッキーフッターを作成します。これは理想からほど遠いので、粘着性のあるフッターを作成するためのより良い方法を見つけるでしょう。おそらく、これらの回答で提案されたものは、この試行錯誤されたアプローチを支援または使用する可能性があります

CSSトリックスティッキーフッター

また

JQuery Sticky Footer

これがお役に立てば幸いです。

于 2012-07-03T20:24:19.410 に答える
0

pointer-events: none;cssプロパティ(html、body、wrapper、baixo、push、footer)からすべてを削除します。すべてのマウスイベントを無効にしたいと思っていたようですが、マウスクリックで何も起こらないのはなぜですか?

于 2012-07-03T20:25:23.840 に答える
0

まず、ラッパーの負のマージンを削除します。

#wrapper {
    margin:0 auto;
}

次に、div.push をまとめて削除します (HTML コードから削除します)。最後に、「ポインター イベント」を削除します。

これで、フッターは常にコンテンツのすぐ下になり、ユーザーはフォームに入力する必要があります。

また、好奇心からですが、ほとんどのコードはフッターまでDIV(適切な)で行われているようです。次に、ブーム、それはテーブルシティです (スタイルシートとメタタグがランダムに貼り付けられていることは言うまでもありません)。フッターはサードパーティのものですか?

于 2012-07-03T21:12:09.733 に答える
0

.push は、フッターを下部にとどめるには悪い方法のようです...これを行う別の方法は次のとおりです。

HTML

<html>
     <head>
          <title></title>
     </head>
     <body>
          <div id="paddingFix">
               <div id="content">
                   <!-- Your content goes here. -->
               </div>

               <div id="footer">Footer</div>
          </div>
     </body>
</html>

CSS

body,html {
    height:100%;
    padding:0px;
    margin:0px;
}
#paddingFix {
    min-height:100%;
    position:relative;
}
#content {
    padding-bottom:60px;
    text-align:center;
}

#footer {
    height:40px;
    position:absolute;
    left:0px;
    bottom:0px;
    color:#FFF;
    background:black;
    width:100%;
}

デモ

基本的に、min-height:100% であるコンテナーの絶対下部にフッターを配置します。相対位置; すべてのコンテンツはコンテナ内にあり、フッターの高さに少しのスペースを加えたサイズのパディングボトムがあります。

于 2012-07-03T20:28:15.350 に答える