私はHTML / CSSの完全な初心者です。私は現在、別のページにリダイレクトするリンクを含むラッパーをWebサイトに持っています。私の目的は、それぞれのページにいるときに押されたように見えるようにリンクを更新することです。
この例としては、スタックオーバーフローが発生しているときに[ジョブ]ページをクリックすると、stackoverflow.com / jobsにリダイレクトされ、そのリンクが強調表示/押されます。
私の理解では、ラッパーを実装する方法はコンテナーを使用することです。
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<h1><a href="index.html">myname</a></h1>
<nav class="links">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="resume.html">Resume</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav>
.
.
.
私のプロジェクトは、_wrapper.scss
ファイルを含む既成のSASSテーマです。SASSファイルをコンパイルしてCSSに変換する方法を学ぶ準備ができていないと思うので、このファイルを編集するつもりはありませんが、希望する結果を得る別の方法はありますか?
onmouseover
とonmouseout
イベントはよく知っていますが、達成したいイベントはありますか?
ありがとう!
あなたがに割り当てることができるCSSクラスを定義開始するにはli
、それがされていることを示すために、それの外観変更する要素押された例を
li.pressed { font-weight: bold; }
次にli
、ロードされたページに基づいて、このクラスを正しい要素に適用する方法が必要です。各ページのナビゲーションをカットアンドペーストするだけで、手動でこれを行うことができます。
<li class="pressed"><a href="resume.html">Resume</a></li>
このアプローチは、サイトにページを追加するにつれてうまく拡張できません。クラス属性を割り当てるスクリプトへのパラメーターとしてページを提供できる必要があります。
使用するスクリプトは、クライアントまたはサーバーで実行できます。パラメータの正しい値を取得する方法は、スクリプトが実行される場所によって異なります。
サーバーサイドスクリプトは、ページのHTTPリクエスト内の情報を使用しhref
て、押されたボタンの情報と一致させます。
クライアント側のスクリプトはwindow.location
プロパティを使用href
し、押されたボタンに一致するものを見つける必要があります。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加