プログラミングを初めて二ヶ月です。
初歩的な質問ですがアドバイスいただければと存じます。
現在画像をホバーで切り替え、さらにそれにキャプションをつける機能を実装しています。
しかしそれにコメントを表示するのがうまくできないです、、、
https://gyazo.com/6a2ed70010ed443806d5fe145a1966f0
現在は以上のssのように画像の上にカーソルを置くと右側に大きく表示されます。
以下は現在のコードです。
<div class="mainImage">
の上にたくさん画像が設置してあってホバーでこのmainImageクラスに出力されます。
これで画像の切り替えの実装がなんとかできました。
<div class="mainImage"> <%= image_tag @post.main_image_url, class:"alt_text" %> </div> <script type="text/javascript"> $(function(){ $('.thumbnails img').hover(function(){ var $thisImg = $(this).attr('src'); var $thisAlt = $(this).attr('alt'); $('.mainImage img').attr({src:$thisImg,alt:$thisAlt}); }); }); </script>
###発生している問題・エラーメッセージ
現在はこのように出力されています。 <img class="alt_text" src="/uploads/post/appeal_2/33/main_pic_20170918110403.jpg" alt="ああああああ"> このaltの値を取得してキャプション風に表示するjqueryがうまくかけないです。
###試したこと
https://nelog.jp/alt-img-caption
以上の記事を参考にしましたが、うまくできませんでした。
画像のatlを取得
それを出力する
の以上のコードを書きたいです。
MRCはrailsで書いています。
アドバイスいただければ幸いです。
回答1件
あなたの回答
tips
プレビュー