ブログ_音楽仲間 + 久しぶりの大乱闘だったゼw

ブログ_音楽仲間

久しぶりの大乱闘だったゼw

>>前回
>>前回

無事に新しい☆music.BBSのスマホ版トップを公開出来ました。
気に入らなかったのは、トップページから投稿フォームへの移動が面倒っぽかったところで、トップページに投稿フォームへのリンクとか追加したかったのですが、子ページを改善する事に考え直した次第です。

 ‐‐‐‐‐‐‐‐‐‐‐‐ 

>>前回

少し時間が出来たので作成中掲示板をいじった。。

現在スマホ版のスレッド内ページを編集中なのですが、トップ記事の直下にある広告がイヤで、消すか遠いボトムに移動させたいと思い久々に奮闘しました。

HTMLを簡単に書くと...

〈article class="article"〉
〈font〉記事タイトル〈/font〉
〈font〉名前〈/font〉〈a〉メール〈/a〉など..
〈font〉本文
〈a〉〈img〉ファイル〈/img〉〈/a〉
〈/font〉
〈div〉諸々のリンク〈/div〉
〈div〉諸々のリンク〈/div〉

〈div align="left"〉snsリンク〈/div〉
〈div align="right"〉編集などのリンク〈/div〉
〈hr〉
〈script title="広告のスクリプト"〉〈/script〉
〈hr〉
〈/article〉

...こんなカンジのソースで、この部分のHTMLを全く編集出来ない為、広告をうっちゃる為に数時間格闘しました。
まず試したのは、JavaScriptでScriptを変更する事だったのですが、どうにも不可能でした。

それでやったのは、CSS3の隣接する要素のスタイル変更だった。。

↓↓こんなヤツ↓↓
要素1 ~ 要素2{プロパティ:値;}
例:
〈h2〉内容〈/h2〉
〈p〉内容〈/p〉
〈p〉内容〈/p〉

これは、要素1(例:h2)の直下にある要素2(例:p)に対してスタイルを適用するのですが、僕がやりたいのは直下の全ての要素に適用する事なのでユニバーサルセレクタにしました。...

↓↓こんなんです↓↓
article div[align="right"] ~ *{
position:absolute;bottom:-380px !important;
opacity:0 !important;
}


※エンド〈/body〉下の-380pxに表示
※透明度0、見えなくする
※ !important は、最優先
※注:スタイルは後の記述が優先される
※注:〈html〉タグに position:; が指定してあります



...実際は article に対して2ページ目以降 display:none; を指定しました。
、、その訳は、ブラウザ毎に表示される広告が違うからで、、中でも厄介なオーバーレイ広告は消すしかないのでこうなりました。
出来るだけ表示する方向でやったのですが、許せない内容を表示しない為に見えなくせざるを得ませんでした。。
ちなみに、レスの直下にある広告は全部スレッドのボトムに表示されているハズ?ですw


いあ〜〜、久しぶりに書いたなーw
久しぶりの大乱闘だったゼw

スタイルを間違いなく適用させる為には〈body〉内の、出来れば〈script〉直下に〈style〉を記述するべきですが、とりあえず〈body〉直下でスタイル変更出来ました。

※HTML5では、〈body〉直下への〈style〉の記述が認められています。
コメント
アクセス制限機能充実
夢小説のDLove
- ナノ -