- 締切済み
いいねボタンのコメント欄位置
facebookのいいねボタン設置についての質問です。 html5版のいいねボタンを公式から設置したのですが、コンテンツの右側にボタンを設置したため、ボタンを押下後に出るコメント欄が表示されるとbodyのmin-widthを超えて横スクロールが出てしまいます。 ボタンを含めてiframeの中なので右寄せにはできないですし、bodyにoverflow:hiddenを掛けるのはデザイン上好ましくない状態です。 多分無いような気はしますが、もしコメント欄の位置を調整する方法をご存じの方いらっしゃいましたらご教授ください。
- picicate
- お礼率58% (101/172)
- CSS
- 回答数1
- ありがとう数8
- みんなの回答 （1）
- 専門家の回答
みんなの回答
bottunを押した後の処理⇒windowの位置を、CSSに記述すれば？・・・
関連するQ&A
- facebookのコメント欄の返信ボタン
facebookのコメント欄の返信ボタンについてお尋ねします。 facebookのコメント欄に返信ボタンが表示されている方が多くいます。 私のfacebookのコメント欄には返信ボタンが表示されていません。 どのようにしてfacebookのコメント欄に返信ボタンを表示させるのか教えてください。
- 締切済み
- iframeの横スクロール
iframeを使ってほかのページを表示させているのですが、 どうしても横スクロールバーが出てしまうのでcssのbody要素に 「overflow-x: hidden;」と入れました。 確かにiframeの横スクロールバーは消えましたが、ページの横スクロールも消えてしまいました。 div idでiframeを囲ってcssでその場所だけに「overflow-x: hidden;」を入れると今度は横スクロールバーが消えません。。 色々調べてみたのですが同じような人がいないようで； 詳しい方教えていただけないでしょうか。 （説明がへたくそですみませんm(_ _)m）
- ベストアンサー
- その他([技術者向] コンピューター)
- facebook いいね！ボタンについて
会社のホームページを製作し ページごとにfacebookのいいね！ボタンを配置しようとしています とりあえず数ページにいいね！ボタンを配置し ボタンをおしているのですが 自分のfacebookのタイムライン、友達のニュースフィードに記事が反映されません ただアクティビティログには反映され、友達のページから自分のfacebookページを見ると いいね！の記事が反映されています ページ内のタグは下記のような感じです <html lang="ja" xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml"> <head> <meta property="og:title" content=""> <meta property="og:description" content="" /> <meta property="og:type" content="website"> <meta property="og:image" content=""> <meta property="og:url" content=""> <meta property="og:site_name" content=""> ※og内の""の中は、実際は入れてあります 下記も入れたりしていますがダメでした・・・ <meta property="fb:admins" content="" /> <meta property="fb:app_id" content="" /> </head> <body> <script type="text/javascript"> var url = document.URL; document.write('<iframe src="http://www.facebook.com/plugins/like.php?href='+ … scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:21px;" allowTransparency="true"></iframe>'); </script> もしくは <iframe src="http://www.facebook.com/plugins/like.php?href=ht … scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:21px;" allowTransparency="true"></iframe> ※ボタン内のURLは実際のものとは違います </body> </html> 現状のURLがテスト用のアドレスだからなのかもしれませんが 行き詰っています・・・ 何卒よろしくお願い致します
- ベストアンサー
- CSS
- いいねボタンのコメント用ポップアップが消える
こんにちは． HTML初心者です． Facebookのいいねボタンを設置したところ，正常に動作しないようなので質問させていただきます． 【症状】 ウェブページに設置したFacebookのいいねボタンを動作確認のためにボタンをクリックしたところ， 表示されるはずのコメント用ポップアップが一瞬表示された後，何も操作していないのにすぐに消えてしまい困っています． この時点ではいいねボタンのカウントは増えません． ポップアップが消えた後は，いいねボタンが「承認」という文字になり，クリックすると別ウィンドウで「「いいね！」を認証」というページのポップアップが現れ，「いいね！」または「キャンセル」を選べるようになります． ここで「いいね！」を押すとカウントは増えるのですが，コメントを書き込むことができません． コメントを書いた上でいいね！と押せるようにしたいのです． 【動作確認したパソコン】 Windows XP 【動作確認したブラウザ】 Google Chrome （バージョン 24.0.1312.57 m） Firefox （バージョン 16.0.2） 以下にソースコードの一部を示します． 埋め込みコードはFacebookコネクトのページ （http://developers.facebook.com/docs/reference/plugins/like/） から発行しました． HTML5で記述しています． （XFBMLでも試しましたが，同様の症状が出ました．） ======================================== 【HTMLタグ】 <html xmlns="http://www.w3.org/TR/xhtml1" lang="ja"> 【BODYタグ内】 <!-- Facebook共有ボタンスクリプトここから --> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <!-- Facebook共有ボタンスクリプトここまで --> <!-- Facebook共有ボタンここから --> <div class="fb-like" data-href="<!-- 表示させたいページのURL -->" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div> <!-- Facebook共有ボタンここまで --> ======================================== オブジェクトデバッガ（http://developers.facebook.com/tools/debug/og/object）で確認しても， 特にエラーや警告はありませんでした． コメント用ポップアップを正常に表示させるにはどのようにしたらよいでしょうか． iframe版は正常に動作することを確認済みです． iframe版のほうがIEでも表示できるなどのメリットがあり，そちらのほうが推奨されていますが， コメントも書き込めたほうがいいので，HTML5かXFBMLで設置したいと考えております． なにか足りない情報やご指摘がありましたらご連絡ください． よろしくお願いいたします．
- 締切済み
- HTML
- ボタンを画像に変更したい
iframe内のコンテンツを親からスクロールさせる URLを参考に http://moto-mono.net/2009/07/10/scroll-content-is-contained-in-iframe.html のデモのように、なんとか出来ましたが、ボタンを押下して上下のスクロールしているので、画像を配置し、上下にスクロールできるようにしたいのです。 <input type="button" id="down" value="↑" /> <input type="button" id="up" value="↓" /></p> ↓とやってみたのですが出来ませんでした。 <img id="up" src="up.jpg" alt=""> <img id="doun" src="doun.jpg" alt=""> ボタンでなければ、出来ないのでしょうか？ 出来なければ、ボタンを画像のように見せる方法はありますか？
- ベストアンサー
- JavaScript
- CSSでインラインフレームを非表示にしたい
初心者です。 いろいろ試したのですがうまくいかないので教えてください。 複数のインラインフレームのレイアウトを、スタイルシートで一括管理したいのですが、 たとえば、 <iframe class="free" src="http://www.***" scrolling="no" frameborder="no"></iframe> <iframe class="only" src="http://www.***" scrolling="no" frameborder="no"></iframe> <iframe class="link" src="http://www.***" scrolling="no" frameborder="no"></iframe> と縦に並んでいるインラインフレームをｈｔｍｌは変更せずに、 真ん中の「only」だけ隠すことはできませんか？ スペースが空かずにfreeとlinkだけが並んでいる状態にしたいです。 宜しくお願いします。 .free { width:450; height:760; border:none; margin: 0px; overflow: hidden; } .only { width:450; height:680; border:none; margin: 0px; overflow: hidden; } .link { width:450; height:680; border:none; margin: 0px; overflow: hidden; }
- ベストアンサー
- CSS
- cssで擬似フレームについて
はじめて質問させていただく、CSS初心者のものです。 下記のdivタグを画面中央寄せにする方法はあるのでしょうか？ HTMLとCSSは下記のように書いています。 HTML <body> <div id="header"> （width="800" height="180" のflashファイルを入れています） </div> <div id="main"> （ width="700"のコンテンツを作りスクロールさせていま） </div> <div id="footer">テキストを一行入れています</div> </body> ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ ｃｓｓ html{ height:100%; overflow:hidden; } body{ height:100%; width:100%; margin:0px auto; background-color: #000000; } #header{ position: absolute; height: 180px; width: 800px; overflow: hidden; top: 0px; } #main{ overflow: auto; position: absolute; width: 800px; top: 180px; bottom: 20px; background-color: #FFFFFF; } #footer{ position: absolute; width: 800px; bottom: 0px; font-family: "Courier New", Courier, mono; font-size: medium; font-style: italic; color: #00FF33; height: 20px; background-color: #000000; overflow: hidden; } このような感じなのですがなにかいい方法があればご教授お願いいたします。
- ベストアンサー
- HTML
- ホームページを作っています、ページ内にiframeで他のページを表示さ
ホームページを作っています、ページ内にiframeで他のページを表示させています。 IEではこのiframeにスクロールバーが出て、縦に長いデータをスクロールして閲覧あせる事が できるのですが、Firefoxだとスクロールバーが出ません・・・ どなたか表示させる方法をご存知でしたら教えてください。 以下HTML記述 <iframe name="iframe4" id="iframe4" frameborder="0" scrolling="yes" src="topix.html" title="※※">※※</iframe> CSS記述 #iframe4{ border-width : 0px 0px 0px 0px; margin-left : 0px; width : 420px; height : 490px; padding-top : 0px; overflow : hidden; margin-top : 0px; margin-right : 0px; margin-bottom : 0px; padding-bottom : 0px; }
- ベストアンサー
- HTML
- yahooニュースコメント欄「そう思う」欄に
本日yahooニュースをスマートフォンで見ていた時に画面を指でスライドしさせていたら コメント欄部分の 「そう思う(facebookの「いいね」のようなもの)」欄にあるアイコン (賛成、反対を意味するようなアイコン)に画面をスライドする指が触れていたのか、意図しないコメントに 「いいね」のマークが付いてしまいました。 しかも、読んでみると過激なコメントでしたので、慌ててもう一度タップしても取り消せず 「よくないね」を意味するアイコンを新たに押しても取り消せません。 もう一度、そのコメントに賛同できない為 過激に思えるコメントに「よくないね」のアイコンを押したら 「すでに一度クリックされています」 といった意味ののエラー表示が出て、クリックを受け付けてくれません。 ページを更新してもう一度クリックしたら システムのエラーが起きたので、時間を空けて下さいとのエラー表示が出て やはり訂正できませんでした。 近くにある別のコメントに「いいね」を押した後 「よくないね」のボタンに押し直すのはスンナリと出来ました。 元々ニュースにコメントしたり、Twitterなども殆ど使用しないので、知識不足もあり、こういうエラーは 何だか怖いし、気味が悪いです。 コメント毎に、リアクションの制限が設けられているとは考えにくいので、コメントへの賛同を取り消せたらと思っています。 取り消しツールはあるのでしょうか？ また、取り消すにはyahooニュースの運営をしている方にお問い合わせをする または、たかがコメント欄と諦める方がいいのでしょうか？ コメント自体は非表示にできたり、通報できるツールはありましたがfacebookのように「いいね」を取り消すツールは見当たりませんでした。 見ていたニュースは、中学生が自殺したニュースで 画面をスライドする際に指が「いいね」のアイコンに認識されてしまったのは、その原因を作ったの方に対する過激なコメントで、賛同できない意見でした。
- ベストアンサー
- Yahoo!サービス全般
- DIV 領域内でのオートスクロール
当方はプログラミングやJavascriptなどにはとても疎く、サンプルなどは色々あるのですが、どのように改良すれば良いのかわかりません。 HTMLでWEBのページを作成しているのですが、下記の条件があります。 ・表示領域が600×300 ・ブラウザ標準スクロールバー使用禁止 ・<iframe>使用禁止 <body> ～～～ <div style="overflow:hidden;"> ここの部分だけJavascriptでオートスクロール </div> ～～～ </body> 駄文で申し訳ないですが、どなたかご回答願います。
- ベストアンサー
- JavaScript
お礼
すいませんありがとうございました。
補足
すいません、説明の仕方が悪かったでしょうか。 今回対象がfacebookのいいねボタン、つまり外部のURLにあるページをiframeで表示していて、 ■ボタン ｜ポップアップする｜ ｜コンテンツ ｜ という具合に外部URLページを表示したiframe内にボタンがある状態です。 このため、facebookに自サーバーからiframe内のCSSをjs等で操作できない状態にありますので、facebook側やAPIサービスなどで右揃えにするとかのサービスがないかというご相談です。