PrivateMoonPrivateMoonゲーム系イラスト、日記など。Javascriptが無効の場合、正常に閲覧出来ません。TopこのサイトについてイラストmenuTagCSS透明度を自由に調整出来る程度のアレの技術的なメモ。Javascriptということで、一応メモ的なところをば。実装しようと思ったらそういったものを利用するのが一番手っ取り早いのです。個人的な練習用に自作してみたものなのでかなり適当ですが、一応形にはなりました。要は二枚の差分画像のうち、片方の透明度を変化させて一部の透明度を調整しているように見せかけていたわけなのですね。id="slider-image"></div>HTMLは上記のようになっていました。上半分がスライダーで、下半分が画像の部分です。CSSとJavascriptは長くなるので割愛。いってもそこが一番重要なので、サンプルを置いておきます。興味のある方はどうぞ。■スライダー的なアレのサンプルダウンロード画像を差し替えればそのまま使えるので、是非いろんな透明度を調整してみてください。tumblrWebサイトってだいぶ進化したものですよね。RO今更ですが、私はWeb関係の仕事をしてますので、Webページを構成するHTMLとかCSSとかJavascriptについてはそこそこ勉強しています。このサイトも、テンプレートは一応配布のものを基にしてますがかなり自分でカスタマイズして別物になってしまっています。多少の知識はここ数年のうちに付いたと思っています。必要な情報だけを非同期通信で取得してみたりとか、いろんな技術が実装されてきました。前はリッチコンテンツだとか言われていたようなものも今ではとりわけそう言い示すこともなく、当たり前のように使われています。基本的に今はHTML+CSS+Javascriptで作るのが主流かと思います。今後さまざまなアプリケーション要素がWebサイトに組み込まれていくことかと思います。今回ちょっとCSSとJavascriptを使って、スライダーを作ってみました。↓これは画像(Firefoxでの表示)です。いう操作フォームも、画像などは一切不要で意外と出来てしまうものです。動作の制御はJavascriptでやるのですが、同時にこのスライドのパラメータをどこかに反映させるようにすれば、ユーザーの調整しだいでページ内のコンテンツを動的に変化させるようなことも可能です。いうことで、以下実例です。※動作確認はIE8、Firefox、Chromeなどでやってます。万一動かなかったらすみません。透明度:0%ソーサラーさんの服の透け具合が自由に調整できたらステキですよね?(^ω^)今回はそういうお話でした。forgeのご隠居様です。有坂先生ありがとうございました。日曜日の列は赤字にしたり土曜日の日を青字にしたいというこだわりがあるんですが、デフォルトなどは列ごとに区別できるclassとかはさっぱり入ってないので、CSSで指定したりできませんでした。プラグインのカレンダーを色々探しましたが、ぱっと見そのあたりを満たしてそうなのはなさげだったので、もうこれは作るか...と。Calenderが機能的にステキだったのと、いい感じに弄れそうだったのでこれを改造しちゃうことに。GPLらしいので公開しちゃうー。wd1というclassが追加されるので、これらに対してCSSを指定します。Calenderの場合は、clalender.cssでデザイン指定しているので、その中に書くのもよいですし、使用中のテーマファイルのCSSに追加しても良いと思います。{color:#0000CC;}平日の色はテーマファイルの色に準拠していると思います。うちの場合は他にも色々やってるんですが、とりあえず列ごとに色を変える方法として紹介しました。カレンダーに関する部分を同じように修正すれば、デフォルトのカレンダーも同様に出来ますが、あんまりincludesのファイルを弄ると本体アップデートの際に元に戻ってしまうので出来ればこういうのはプラグインとかテーマファイル内でやりたいですね。Yu.Kanduki。