javascript - エントリごとにホバー機能が動的に機能しない

Question

そのため、私はページに取り組んでおり、ホバー機能を動的に設定する際にわずかな問題が発生しています。私がやろうとしているのは、エントリごとにホバー機能を作成することです。考えられることはすべて試しましたが、常に各エントリに同じホバー機能が割り当てられているようです。だから、私が作ったウェブサイトではなく、jsfiddleで動作するソリューションにたどり着きました。

動的ホバー機能を作成するより良い方法はありますか、またはこれを機能させるにはどうすればよいですか? どんな助けでも大歓迎です。

フィドルへのリンク

ウェブサイトへのリンク

Answer 1

これは ExpressionEngine とは何の関係もありません。Jquery で行う必要さえなく、純粋に CSS で行うことができます。

問題は、ヘッダーまたはボディ html の下部で集中型の JS ファイルを使用する代わりに、チャネル エントリのすべてのループで JS を出力していることです。同様のアドバイスは、CSS をインラインではなく一般的な CSS ファイルに移動することです。

.MF {
hide the rollover text
}
.MF:hover {
hide the title and sub-title
show the rollover text
margin-left the arrow
}