Press J to jump to the feed. Press question mark to learn the rest of the keyboard shortcuts
1
ArchivedStickied post

マルチバイト文字のタイトル

1
2 comments
2
Archived

redditのコメントの著作権は投稿したユーザーにあります。
著作者人格権も当然そのユーザーにあります。
そして著作者人格権には氏名表示権が含まれます。
CSSで名無しを強制することは権利の侵害になりえます。

名無しを強制ではなく選択制(匿名フレアーを選択したユーザーに)し、
ユーザーの権利を侵害しないように改善します。


このスレ(CSS実験サブレ)でお試し頂けます。
匿名フレアーは「匿名希望」「Anonymous」の2つです。※サンプルです
「変更できます」と「氏名表示権」は匿名ではなく、名前の左にそのフレアーが表示されます。
名前のあとの"氏"にマウスカーソルを当てると匿名であってもユーザー情報が見られるのは意図した仕様です。

2
4 comments
2
Archived

2つの案を検討しましたが、両方とも検証NGのため廃案です。
ここにその検証結果を残します。


まずはスタイルシートの実例を見てください。
「ネタバレを見る」にマウスカーソルを当てると・・・?


#safeコマンド

ネタバレを見る


書式

[ネタバレを見る](#safe "任意の文章")

解説

ネタバレをリンクされる文字列に書くと、スタイルが効かない専ブラでは隠せない(見えてしまう)問題がある。
そこで、ネタバレをtitle属性に埋め込む方式を検証したが、結果はご覧の通り、ツールチップ表示が邪魔である。
title属性からテキストを取ってくるので絶対にツールチップからは逃れられない。よって廃案。
Alien Blueからネタバレが見えてしまう問題もある。

 


#tipコマンド

tooltipネタバレ


解説

tooltipでOK、という案。
ツールチップの文字装飾ができないものの、改行は普通にできる。
しかし、検証NGのため廃案。

書式

[tooltipネタバレ](#tip "任意の文章")

投稿例

[tooltipネタバレ](#tip "ここにネタバレ本文を書く。
ツールチップは改行もできる。")

検証NG

1.Alien Blueでtitle属性がコメントにダブルクォート付きで表示される。
リンクされる文字列と同様にtitle属性もNG。
2.iOS Safariでタップすると、別ウィンドウが開き、戻ってもツールチップは出ない。
iOS Safariでは見る手段がないのでNG。

2
comment
2
Archived

まずはスタイルシートの実例を見てください。
「ネタバレを見る」にマウスカーソルを当てると・・・?


ネタバレ注意!!

ここにネタバレの文章を書きます。
普通に改行を使ってもOK!


#netaコマンド

書式

[任意の文章](#neta)

投稿例

[ここにネタバレの文章を書きます。
普通に改行を使ってもOK!](#neta)

スタイルシート
"ネタバレを見る"の部分を任意の文字に置き換える場合はwidth調整が必要になります。

.md p a[href="#neta"]:before{color:#f33; font-weight:bold; display:block; content:"ネタバレを見る";}
.md p a[href="#neta"]{background-color:#ddd; color:transparent; display:block; padding:2px; height:25px; width:105px; overflow:hidden;}
.md p a[href="#neta"]:hover{color:black; height:auto; width:auto;}
.md p a[href="#neta"]:hover:after{display:none;}

スタイルシート解説

1行目は、ボタン名「ネタバレを見る」とその文字装飾を指定する。
2行目は、本文を隠すために表示領域をボタン名の範囲で固定し、共通の背景色と、念のため文字色の透明化と、スクロールバーを無効化する。
3行目は、マウスオーバーで表示領域を解放(自動化)する。タッチパネルはクリックも発生するが、URL「#neta」はページ内リンクなので、多くのブラウザではページ移動が発生しない。
4行目は、マウスオーバー終了で、表示領域を元に戻す。

推奨ルール(運用するとしたら・・・)

①スタイルシートが効かない専ブラに配慮して、フレアー/サブミッションタイトルに [ネタバレあり] をつける。
② [ネタバレあり] では「ネタバレを見る」機能を使用しても良い。
③それ以外では使用しない。

ライセンス

パブリック・ドメイン(権利放棄)

 

テスト書き込みはご自由にどうぞ。


 

動作報告まとめ

アプリ(iOS8.2) 結果
Safari(標準ブラウザ) 「ネタバレを見る」をタップすると本文が見える
amrc 本文が見えてしまう
Redditor 本文が見えてしまう
Alien Blue 本文が見えてしまう
BaconReader 本文が見えてしまう
iAlien 本文が見えてしまう

 

アプリ(Android5.1) 結果
reddit is fun 本文が見えてしまう
BaconReader 本文が見えてしまう
Relay for reddit 本文が見えてしまう
Sync for reddit 本文が見えてしまう
Now for reddit コマンドごと本文が見えてしまう

 

OS ブラウザ 結果
Win7(64bit) IE11 マウスオーバーで本文が見える
Win7(64bit) Firefox ESR31.4 マウスオーバーで本文が見える
Win7(64bit) Chrome 41.0 マウスオーバーで本文が見える
Win7(64bit) Safari 5.1.7 マウスオーバーで本文が見える
OS X 10.9.5 Safari 7.1.4 マウスオーバーで本文が見える
OS X 10.9.5 Chrome 41.0 マウスオーバーで本文が見える
iPhone5s Safari iOS8.2 タップで本文が見えるけど時々1回で開かない
Pad2 Safari iOS8.2 タップで本文が見えるけど時々1回で開かない
iPhone5 Safari iOS8.2 タップで本文が見えるけど時々1回で開かない
iPad mini retina Safari iOS8.2 タップで本文が見えるけど別ウィンドウが開く
iPad 初代 Safari iOS5.1.1 タップで本文が見えるけど別ウィンドウが開く
Nexus7 初代 Chrome 41.0 タップで本文が見えるけど反応がもたつく

 

2
27 comments
Community Details

2

Subscribers

1

Online

ここはshinotのCSS実験用サブレです。

Create Post
Cookies help us deliver our Services. By using our Services or clicking I agree, you agree to our use of cookies. Learn More.