0

私はここでサイトに取り組んでいます：

http://www.jasnasyogaonline.com/membership-test.php

右のナビゲーションにカーソルを合わせると、背景がリンクの中央から上下にアニメーション化するフェードイン効果が表示されます。3 つの色付きの線 (右側のナビゲーションの境界線) の間に白い色があることがわかります。これは、サイトの他のページでは背景が白であり、元のプログラマーが背景画像を使用してナビゲーション項目の「対角線」の端を作成したためです。ページ全体のビデオ/画像があるため、背景が白ではなく、効果が失われるため、これは機能しません。

私のクライアントは、かみそりの線の間を透明にするだけでなく、ナビゲーション項目を斜めのエッジに保つことを検討しています。nav アイテムの最後にある画像を削除すると、まっすぐな長方形になります。Borders/border-widths などでいくつかの CSS を試してみましたが、ソース コードを見ると、ホバー効果を作成するために imagecreatetruecolor を使用している PHP ファイルによって背景が生成されているため、少し注意が必要です。

かみそりの線の間の領域を透明に保ちながら、右のナビゲーションの角を切り取る方法についてのアイデアはありますか? 私はアイデアを使い果たし始めています。ご協力いただきありがとうございます！

4

2 に答える 2

1

私の提案は、ホバーエッジのdivをまとめてドロップすることです

  .nav ul li div {

バックグラウンド スプライト/アニメーションを使用してアニメーションを再コーディングします。実際には、マウスオーバー効果はまったく好きではありません。テキストの外側のグローや下線効果など、より簡単に行えるものを顧客に売り込むことができるかもしれません。

また、この投稿はPHPとは何の関係もありません

于 2013-10-14T19:59:43.390 に答える
-1

編集これを実現する別の方法は考えられませんが、このデザインが必要な場合は試すことができます。

.nav ul li a:hover {
color: #FFFFFF;
text-decoration: none;
-moz-border-radius: 10em 0em 10em 0em;
border-radius: 10em 0em 10em 0em;
text-align: center;
}
于 2013-10-14T20:34:25.897 に答える