2015年4月の更新履歴
本日の発売アイテム
- ふなっしー バラエティカード
- ランダムカードINFINITE のCDA(Maximum Single) [24時間] の特典カードです。
- トレーディングカード井口裕香のCDA(Maximum Single) [Hey World] の特典カードです。
お知らせ
PlayOnLinux でインストールできる Internet Explorer 8 で確認してみました。大体予想どおりでした。
古いブラウザのために最新のブラウザでページの実行速度が低下するのは気に入らないので、Xdomain のサイトで修正作業を行う予定はありません。
旧サイトや Blogger では Internet Explorer 8 向けの修正作業を行っています。多少異なる部分もありますが、閲覧すること自体には支障はないと思います。
情報を追加しました。
お知らせ
ナビゲーションの背景色やボーダーの色をグレーからベージュっぽい色に変更しました。
旧サイトのスクリプトファイルに document.createElement を追加しました。削除したのは半年ほど前ですが、すっかり存在を忘れていました。
構成の都合上、全ファイルで jQuery を読み込むことになったので、表示完了に多少時間がかかるページがあるかもしれません。
jQuery が使えるので、ページ内スクロールは scroll-behavior ではなくスクリプトで動きます。
Modernizr は以前も SVG と PNG の使い分け程度にしか使っていなかったので、今回は利用しないことにしました。
以前とはファイルの中身が異なるのですんなりとはいきませんが、今後もバックアップファイルを眺めながら必要な部分は追加していきます。
Blogger にも document.createElement を追加しました。環境が再現できないので、実際にきちんと表示されるかは不明です。
新規ページを作成しました。
- メタリックプラカード[Fate/Stay night －UNLIMITED BLADE WORKS－ ウエハース] に同梱されていたカードです。
情報を追加しました。
本日の発売アイテム
新規ページを作成しました。
- Weekly Champion Original Trading Card週刊誌 [週刊少年チャンピオン] の応募抽選特典カードです。
- Dream5 トレーディングカードDream5 のCDの特典カードです。
- トレーディングカードThe Challenge のCDの特典カードです。
情報を追加しました。
- トレーディングカードAAA のCDA(Maximum Single) [アシタノヒカリ] の特典カードです。
- トレーディングカードE-girls のCDA(Maximum Single) [Anniversary !!] の特典カードです。
- トレーディングカードPrizmaX のCDA(Maximum Single) [OUR ZONE] の特典カードです。
- トレーディングカードpalet のCDA(Maximum Single) [Time to Change] の特典カードです。
- トレーディングカードApink のCDA(Maximum Single) [LUV －Japanese ver.－] の特典カードです。
本日の発売アイテム
新規ページを作成しました。
情報を追加しました。
本日の発売アイテム
本日の発売アイテム
お知らせ
Zepto.js を試してみました。
ライブラリを差し替えただけです(｢jQuery 2.1.1｣ の部分を ｢Zepto v1.1.6｣ に置き換えました)。ルビをトグルするコードは jQuery 向けのコードをそのまま使っています。
｢Mozilla Firefox 37.0.1｣、｢Firefox Nightly 40.0a1 (2015-04-22)｣、｢Google Chrome 44.0.2376.0 dev｣、｢Opera 12.16｣、｢Opera developer 30.0.1833.0｣、｢Vivaldi 1.0.156.2 (Developer Build) snapshot｣、｢midori 0.5.9｣ で表示確認をしましたが、動作に問題はないようでした。
モバイル機器での動作検証はしていませんが、もともとモバイル向けに作られたライブラリのようですし、｢Firefox OS 2.2 Simulator｣ や ｢Opera Mobile Emulator 12.1 Linux｣ でも問題なく動作したのでたぶん大丈夫じゃないかなと思ってます。
jQuery 向けのコードを Zepto 向けに修正しなくても動いたので簡単でした。2～3日様子を見てから全ページに適用するか判断します。Zepto の公式サイトに記載されている Browser support には ｢Internet Explorer 10＋ (Windows, Windows Phone)｣ と記載されていたので、旧サイトでは jQuery を使い続ける予定です。
新規ページを作成しました。
情報を追加しました。
本日の発売アイテム
- トレーディングカードAAA のCDA(Maximum Single) [GAME OVER ?] の特典カードです。
- トレーディングカードSCREW のCDA [昏睡] の特典カードです。
新規ページを作成しました。
- プラカード[白猫プロジェクト ウエハース] に同梱されていたカードです。
- BBM 阪神タイガース ベースボールカード 2015
情報を追加しました。
- CARDDASS MASTERS G SUNRISE CRUSADE エピソード ブースターパック コードギアス 勝利の意味
- Carddass Battle Spirits trading card game ソウルデッキ 烈風忍者
- Carddass Battle Spirits trading card game バトルスピリッツ 烈火伝 第2章
- GUNDAM WAR NEX-A 第10弾 覚醒する魂
- NET CARDDASS Panini Football League 2015 04
- Carddass モンスターストライク リアルディスクバトル 第2弾 神化大戦
- Z/X －Zillions of enemy X－ スターターデッキ 灼熱の暴竜
本日の発売アイテム
- プラカード[東京喰種 ウエハース] に同梱されていたカードです。
お知らせ
昨日からファイルの修正作業を集中的に行っているので通常の更新作業はお休みしています。明日もたぶんお休みします。
新規ページを作成しました。
情報を追加しました。
- クリアカード[艦隊これくしょん －艦これ－ 艦娘クリアカードこれくしょんガム Part 4] に同梱されていたカードです。
- プラスチック製データカードラムネ菓子 [ミニポケモン図鑑 XY 2015] に同梱されていたカードです。
本日の発売アイテム
情報を追加しました。
- PUZZLE ＆ DRAGONS TRADING CARD GAME スターターデッキ 第3弾
- PUZZLE ＆ DRAGONS TRADING CARD GAME 第3弾 極彩色の伝承
- WIXOSS 構築済みデッキ BLACK NEED
- Weiβ Schwarz ラブライブ ! feat. スクールアイドル・フェスティバル Vol.2
- ChaosTCG エクストラブースター 東方混沌符 特別篇
本日の発売アイテム
- トレーディングカードモーニング娘。’15 のCDA(Maximum Single) [青春小僧が泣いている / 夕暮れは雨上がり / イマココカラ] の特典カードです。
- トレーディングカードパノラマ虚構ゼノンのCDA(Maximum Single) [LIQUID] の特典カードです。
情報を追加しました。
- トレーディングカード西内まりやのCDA(Maximum Single) [ありがとう Forever...] の特典カードです。
- トレーディングカードGOTCHAROCKA のCDA(Maximum Single) [Emotion / Director’s cut] の特典カードです。
- いきものカードいきものがかりのCDA(Maximum Single) [あなた] の特典カードです。
- トレーディングカード私立恵比寿中学のCDA(Maximum Single) [夏だぜジョニー] の特典カードです。
- トレーディングカード2PM のCDA [2PM OF 2PM] の特典カードです。
- トレーディングカードOneness のCDA(Maximum Single) [GO !!] の特典カードです。
- トレーディングカードThe 3rd Birthday のCDA(Maximum Single) [罪状 ｢グルトニー｣] の特典カードです。
- トレーディングカードSCREW のCDA [昏睡] の特典カードです。
- トレーディングカードBREAKERZ のCDA(Maximum Single) [WE GO] の特典カードです。
- ランダムカードINFINITE のCDA(Maximum Single) [24時間] の特典カードです。
お知らせ
検索フォームの文字サイズを本文と同じ(14px)にしました。ブラウザの幅が 748px 以上のときは 16px になります。
お知らせ
本日はひたすらテストをしていたので通常の更新作業はお休みしました。
情報を追加しました。
本日の発売アイテム
お知らせ
過去ログを置いている Blogger (cardcheckbox-pastlog.blogspot.jp) のヘッダーにあるアイコンもインライン SVG にしました。コードをシンプルにするためモバイル機器でもアイコンが表示されるようになっています。
印刷用のスタイルシートを有効にしました。需要があるかどうかはわかりませんが、とりあえず用意しました。印刷用のスタイルシートはあまり調べたことがないので、よりよい書き方があれば適時修正していきます。
トップページのヘッダーにある Blogger へのリンクは更新履歴を転載している方(cardcheckbox-pastlog.blogspot.jp)へのリンクにしました。もうひとつの Blogger の方へのリンク(チャンネルのページにあります)のテキストは区別しやすいように ｢Omake｣ としました。
ヘッダーにあるアイコンを4列にしました(幅が狭いときに有効になります)。長らく3行・3列の配置でしたが、今後は2行・4列になります。右下の固定リンクとアイコンがなるべく重ならないようにしてみました。
Tumblr へのリンクはチャンネルのページに移動しました。現在 Twitter で行っていることはもともと Tumblr で始めたことでしたが、カードとは関係の無い内容になってずいぶんと経つのでトップページからは削除することにしました。
Twitter Widgets のページへのリンクはチャンネルのページからトップページに移動しました。トップページにあった Twitter へのリンクは削除しました。Blogger (cardcheckbox-pastlog.blogspot.jp) のヘッダーにあるリンクは変更していません。
本日の発売アイテム
お知らせ
肝心なことを書き忘れていました。
ブラウザの幅が 300px 以下の時に適用される CSS を追加しました。これまでは 320px が下限だったのですが、それ以下でもレイアウトが大幅に崩れないように調整しました。見れないよりはまし、といった程度ですが。
補足説明の部分などの背景色(#f6f6f6)はブラウザの幅が狭い時に有効になります。広い時はこれまでと同様に字下げになります。用意していたコードを追加するのを忘れていました。すいません。
旧サイトおよび新サイトのページの上部と下部にあるサイトのアイコンは SVG ではなく CSS で作成することにしました。スマートフォンの Above the fold から画像を排除するのが目的です。更新履歴、チャンネルおよび Twitter widget 以外のページでは画像を排除できました。
Blogger (cardcheckbox-pastlog.blogspot.jp) の修正作業が終わりました。引き続き cardcheckbox.blogspot.jp の修正作業を行います。
チャンネルのページのヘッダーにあるアイコンをインライン SVG にしました。このページでしか使っていないアイコンが多かったので、スプライト画像から分離することにしました。
Blogger (cardcheckbox.blogspot.jp) の修正作業が終わりました。このブログのサイドバーにあるアイコンもインライン SVG にしました。
お知らせ
サイトの改修のめどが立ったのでご報告。全体的に見直したのでちょっと時間くっちゃいました。
本文のフォントサイズを 16px から 14px に変更しました。見出しのフォントサイズは h1 が 22px から 20px に、h2 は 20px から 18px に、h3 は 18px から 16px に、ページ内リンクのフォントサイズは 17px から 16px にそれぞれ変更しました。目次のフォントサイズは本文と同じです。その他(注釈など)のフォントサイズは基本的に 13px になります。フォントサイズの更新にあわせてマージンやパディングなども一部変更になりました。line-height の値も 2 から 1.8 に更新しました。
また、文字の色をちょっと濃くしました(#444 から #333 にしました)。未読リンクの色も変更しました(#46f から #34f にしました)。
一部のアイコンを更新しました。スプライト画像内の位置も変更になっているので、キャッシュしている場合は更新が必要です。
ページ内リンクなどにつけるアイコンはいろいろ検討した結果、ブラウザの幅が狭いときは小さめのアイコン(青色の四角いアイコン)、広いとき(1346px 以上のとき)は大きめのアイコン(丸いアイコン)を使うことにしました。意味や動作に違いはありません。また、コードを共通化するためこれまでアイコンがついていなかった所にもアイコンが表示されるようになりました。
丸いアイコンは本文の文字色が濃くなったのに合わせて色を #777 から #555 に変更しました。
更新履歴のページで使っているリボンのアイコンは日付の前に移動しました。他のページでは使わないことにしました。
｢波紋｣(Ripple Effect) はブラウザの幅が 1346px 以上かつ高さが 641px 以上のときに動作するようにしました。
一部のページで補足説明の部分などに背景色(#f6f6f6)をつけました。これまでは字下げで表現していたのですが、ブラウザの幅が狭いときに見づらかったので色を使って区別することにしました。
このページ(更新履歴のページ)に設置している検索ボックスは削除しました。Blogger の方は残します。
印刷用のスタイルシートはまだ調整していないのでコメントアウトしています。そのまま印刷したい方もいるかもしれませんので、旧サイトでは引越しのお知らせなど一部を非表示にするにとどめました。
Blogger はまだ修正していませんのでアイコンがちょっとおかしいです。これから修正します。
おしまい。
新規ページを作成しました。
情報を追加しました。
お知らせ
このページ(更新履歴のページ)に設置している検索ボックスは削除することにしました。ローカルで使っていてあったら便利かなと思ったのですが、利用する機会が少なかったのでコードをシンプルにすることにしました。Blogger の方は残します。
お知らせ
ここ何日か旧サイトの方でテストしていました。ひさしぶりに Opera Mobile Classic Emulator をいじっていたらいろいろ気になる所があったので、CSS をちょっとだけ修正しようと思っていたのですが、結局全部書き直しました。全体的なレイアウトは全然変えていませんが、マージンなどを見直しているので位置的にちょっとずれている所はあります。
アニメーションはブラウザの幅が 1346px 以上で動作するようにしました。デバイスで用意されているアクションを利用した方が良いような気がしたので。-webkit-tap-highlight-color は削除したので、タップすれば反応するはずです。
本文以外(目次など)のフォントサイズを全体的に一回り小さくしました。
トップページで使っていた丸いアイコンは気に入っていたのですが、ちょっとサイズが大きくてスマートフォンなど幅が狭い画面では使いづらかったので試験的に差し替えてみました。
更新履歴のページで使っているリボンのアイコンは日付の前に移動しました。他のページの見出しにも適用しています。
上記の修正はまだ最終的なものではないです。新サイトや Blogger の修正作業はもうちょっと煮詰まってから始めます。
おしまい。
本日の発売アイテム
- 手裏剣戦隊ニンニンジャー キラキラトレーディングコレクション
- プラスチックカード[神羅万象チョコ 一鬼火勢の章] に同梱されていたカードです。
- BBM オリックス・バファローズ 2015
お知らせ
本日も通常の更新作業はお休みしました。
お知らせ
本日は通常の更新作業はお休みします。明日もたぶんお休みです。
お知らせ
メディアクエリで指定していた値をスクロールバーの幅を差し引いた値にしました。スクロールバーの幅は余裕をみて 20px として計算しました(たとえば 1024px で指定していた値は 1004px になります)。
ブラウザの幅が 1346px 以上の時のページ内リンクのフォントサイズを 18px から 17px に変更しました。見た目はほとんど変わりません。
上記の変更は主にパソコン向けブラウザを対象にした修正なので、スマートフォンなどでの見た目や操作感などはこれまでと変わりません。
情報を追加しました。
- 妖怪ウォッチ マルメンココレクション 4
- コレクションカード[仮面ライダードライブ コレクションカードガム 3] に同梱されていたカードです。
- Aquarian Age アイコンセレクトパック vol.2
本日の発売アイテム
- トレーディングカード℃-ute のCDA(Maximum Single) [The Middle Management －女性中間管理職－ / 我武者LIFE / 次の角を曲がれ] の特典カードです。
- オリジナルトレーディングカードつりビットのCDA(Maximum Single) [負けないガッツ －いつか世界を釣り上げます－] の特典カードです。
- トレーディングカード己龍のCDA(Maximum Single) [九尾] の特典カードです。
- オリジナルトレーディングカードベイビーレイズ JAPAN のCDA(Maximum Single) [栄光サンライズ] の特典カードです。
お知らせ
Bing および YouTube での検索を https で検索できるようにコードを修正しました。