X



代替スタイルシートに萌え〜
0001かとり〜ぬ
垢版 |
NGNG
モヂラでしか見られないスタイルシート。
スクリプトでIE対応させてるサイトが密かに急増中。
先ずはここから
http://www.cc-net.or.jp/~piro/
0427419
垢版 |
04/01/28 21:03ID:???
>>424 
あ、そっか。それでいいわけですね。重ね重ね有り難う。

>>425 
一応、これまでの修正を反映させて使用中のスクリプトありますが、
どこか場所をくれればそこにアップロードします。
0428419
垢版 |
04/01/28 22:26ID:???
いまウェブに件のスクリプトをアップロードして試したら、
ローカルでは起きなかった問題が――。
A:固定シートと優先シートとがあり、代替シートの無いページ
B:優先シート無し、固定シートと代替シートがあるページ
このA-B間を行き来すると、選択もしてないのにNo-Styleになってしまった。
B-B間(Bを表示させたあと、再度Bを開く)でもやはり勝手にスタイルが解除される。
A-A間では大丈夫みたいだ。
よくわからないけど、Cookieの所為かしらん。
0429Name_Not_Found
垢版 |
04/01/29 08:32ID:???
function fReadSS(){
/* 現在適用されているスタイルシートを読み込む */
NowSheet="Default";
for(i=0; i<sS.length; i++) {
if ((sS[i].disabled)&&(!sS[i].title)) { NowSheet='No-Style'; break; }
else if ((!sS[i].disabled)&&(sS[i].title)) { NowSheet=sS[i].title; break; }
}
}
...かな。ちゃんと検証してないけど。

それはそうとGeckoでCookieが存在する場合に、
不具合回避しつつレンダリング前に有効なスタイルを指定するためにこういうことをしていて
> document.write('<META http-equiv="Default-Style" content="'+ sheet +'" />');
要は優先スタイル指定をCookieから読み出した名前で上書きしていて
このために>>410の方法で意図される優先スタイル名を取得できなくなっている
(>>410は単にロード時にタイトル付きスタイルの有効/無効を見ているだけだから)。
気になるなら別な対策が必要になる予感。
0430Name_Not_Found
垢版 |
04/01/29 10:28ID:???
>>429
Mozillaは自前でスタイルシート選択ができるから、いいのでは。
何とかしたいのはIEとOpera。
0432Name_Not_Found
垢版 |
04/01/29 12:05ID:4uM/H2Vw
Safariってどうなってるのかな。スクリプトは有効かな。
誰かMacの人〜?
0433Name_Not_Found
垢版 |
04/01/29 14:23ID:???
>>429で、動作確認しました。OKです。今度こそ全て解決、かな。

function main(){/* メイン関数 */
sfTitles="";
sheet = fGetCookie('sheet');
fGetStyleTitles();
if(sfTitles.indexOf(sheet)==-1) sheet = sS.preferredTitle || 'Default';
fChangeSS(sheet);
window.onload=fInit;
window.onunload=fEnd;
}
function fGetStyleTitles(){/* スタイルシートの一覽を取得 */
sS=document.styleSheets;
for(i=0; i<sS.length; i++){
if (sS[i].title){
if (sfTitles.indexOf(sS[i].title)==-1) {
sfTitles+=sS[i].title;
sfTitles+=",";
}
var relS = sS[i].disabled ? 'alternateTitle' : 'preferredTitle';
if ( !sS[relS] ) sS[relS]= sS[i].title;
}
}
if (!sS.preferredTitle) sfTitles="Default,"+sfTitles; // 追加
sfTitles+="スタイル解除";
sfTitle=sfTitles.split(",");
}
0434つづき
垢版 |
04/01/29 14:24ID:???
function fGetCookie(cName){/* クッキーを取得 */
var c=document.cookie, a, b;
if(c.indexOf(cName + '=')!=-1){
a=c.indexOf(cName + '=');
b=c.indexOf(';',a+cName.length+1);
if(b==-1) b=c.length;
return unescape(c.substring(a+cName.length+1,b));
}
return 'noCookie';
}

function fSetCookie(cName,cTitle){/* クッキーを設定 */
var eTitle=escape(cTitle), c;
var cexpires=new Date();
if (cTitle!='')
cexpires.setTime(cexpires.getTime() + 1000*60*60*24*cdays);
else
cexpires.setTime(cexpires.getTime() - 1000*60*60*24);
c = cName + '=' + eTitle + '; domain=' + cdomain + '; path=' + cpath
+ ((cdays!=0)?('; expires=' + cexpires.toGMTString()):';') ;
document.cookie=c;
}

function fChangeSS(ssTitle){/* スタイルシートの動的切替 */
if(!document.styleSheets) return;
sS=document.styleSheets;
for(i=0; i<sS.length; i++)
sS[i].disabled =
ssTitle=='スタイル解除' ? true :
ssTitle=='Default' ? (sS[i].title!=sS.preferredTitle && sS[i].title) : //追加
(sS[i].title!=ssTitle && sS[i].title);
0436つづき
垢版 |
04/01/29 14:26ID:???
fSetCookie('sheet',ssTitle);
}

function fSelectSS(obj){/* 選択されたスタイルシートに切替 */
sheet=obj.value;
fChangeSS(sheet);
window.focus();
}

function fInit(){/* ページが読み込まれたときの処理 */
if (document.stylesheet) insertForm();
}

function insertForm(){/* 選択フォームを追加する */
fMakeHTML();
if(document.all) {
document.writeln('<form action="" class="selectsheet" style="direction:ltr;margin:0;background:#dfdfdf;" id="StyleChangeForm">\n'+nHTML+'</form>');
}
}

function fMakeHTML(){/* 選択フォームのHTMLを作成する */
nHTML='<ul>\n';
for(i=0; i<sfTitle.length; i++){
nHTML+='<li><input type="radio" id="id'+sfTitle[i]+'" name="Style" onclick="fSelectSS(this);" value="'+sfTitle[i];
nHTML+=(sfTitle[i]==sheet) ? '" CHECKED>' : '">';
nHTML+='<label for="id'+sfTitle[i]+'">'+sfTitle[i]+'</label></li>\n';
}
nHTML+='</ul>';
}
0437つづき
垢版 |
04/01/29 14:27ID:???
function fEnd(){/* 終了処理 */
fReadSS();
if (NowSheet!=sheet) fSetCookie('sheet',NowSheet);
}
function fReadSS(){/* 現在適用されてゐるスタイルシートを読み込む */
// NowSheet="スタイル解除";
NowSheet="Default";
for(i=0; i<sS.length; i++) {
// if ((!sS[i].disabled)&&(sS[i].title)) NowSheet=sS[i].title;
if ((sS[i].disabled)&&(!sS[i].title)) { NowSheet='スタイル解除'; break; }
else if ((!sS[i].disabled)&&(sS[i].title)) { NowSheet=sS[i].title; break; }
}
}
0438つづき
垢版 |
04/01/29 14:34ID:???
あと、.jsファイルの先頭に、これね↓。 以上WinIE用でした。

/* スタイルシート切替スクリプト */
/* http://critical.s6.xrea.com/web/cssselect.html */
/* http://minatsu.pos.to/mod_changess_v02.js */
/* http://pc2.2ch.net/test/read.cgi/hp/991400015/398-410 */
/* http://pc2.2ch.net/test/read.cgi/hp/991400015/419-429 */

if ( document.styleSheets
&& !(navigator.userAgent.indexOf("Mac_PowerPC") != -1 && navigator.userAgent.indexOf("MSIE 4") != -1)) {
/* Scriptでスタイルシートを扱えるブラウザのみ実行 */

/* 以下設定 */
cdomain=".pc2.2ch.net"; // サイトのドメイン名
cpath="/hp/"; // サイトのパス
cdays=10; // クッキーの有效日数 0=ブラウザ終了まで
/* 以上設定 */

main();
}
0439終り
垢版 |
04/01/29 14:40ID:???
で、HTMLのhead内に

<!-- スタイル選択メニュー(IE5.5以降のみ) -->
<!--[if gte IE 5.5000 ]>
<script TYPE="text/javascript" charset="Shift_JIS" src="../changess.js"></script>
<![endif]-->

としておいてから、

HTMLソースでスタイル選択フォームを挿入したい箇所に、これを。
<!--[if gte IE 5.5000 ]>
<script type="text/javascript">insertForm();</script>
<![endif]-->
0440Name_Not_Found
垢版 |
04/01/30 20:31ID:???
>>433-439
もう少し整理して書くべきだったな。
"No-Style"は"スタイル解除"にしたのね。
relSって、何の略だ。
0443Name_Not_Found
垢版 |
04/02/15 17:51ID:???
ランダムでスタイルシートを選ぶとかできる?
それができれば(・∀・)カコイイ!!
XSLTでもできればいいなぁ。
0444Name_Not_Found
垢版 |
04/02/15 22:16ID:???
JavaScriptでできるだろ、そんなの。
0447Name_Not_Found
垢版 |
04/02/16 14:58ID:loLWXo8u
他人が改造して自分のサイトで使ってるjs落として勝手に使ってもいいのかな?
マナー違反?
0448Name_Not_Found
垢版 |
04/02/16 15:13ID:???
>>447
禿しくスレ違い。
トラブルに対して一切の責任を負えるなら勝手にしろ。
そうでないなら必要な手続き踏め。それができないならやめとけ。
0449Name_Not_Found
垢版 |
04/02/16 15:22ID:loLWXo8u
>>448
そうか・・・。
代替でかなりおもしろい改造スクリプト見つけたんで、
自分のところで使いたかったもんで。
やっぱり改造者に仁義切るべきかな。
0450Name_Not_Found
垢版 |
04/02/17 09:01ID:???
>>449
仁義というか、普通に「面白いですね。うちでつかいたいんですがいいですか?」って言うだけジャン。
それを言う根性もないの?ドヘタレ?
0452Name_Not_Found
垢版 |
04/02/25 06:14ID:lViUtdSY
http://critical.s6.xrea.com/web/cssselect.shtml
のスタイルシート選択「なし」を表示させたくないのですが、
どこのスクリプトを変更すればよいのか分かりません。
分かる人いたら教えてください。
0453Name_Not_Found
垢版 |
04/02/25 06:23ID:???
勉強しなさい。
せめてスレ違いだってことくらい気付けるようになりなさい。
0454Name_Not_Found
垢版 |
04/02/25 15:02ID:???
JavaScriptの問題だが、「スレ違い」ってこともないな。

sfTitles+="なし";
を削ってみれば?
0455Name_Not_Found
垢版 |
04/02/25 18:10ID:???
>454
JavaScript の「教えてください」なスレは他にある。
0456Name_Not_Found
垢版 |
04/02/25 19:17ID:???
>>455 しかし特にスタイル切換スクリプトに関してはこのスレッドで幾度か質問や回答がされてきたわけだが。
0457Name_Not_Found
垢版 |
04/02/25 19:24ID:???
>456
有用な質問やら回答やらなら構わんと思うが、
「やり方がわかりません、教えてください」だけってのはどうよ。
もっと基礎的なところに立ち返ってやっていって欲しいんだが。
0458Name_Not_Found
垢版 |
04/02/26 14:47ID:5nZud7tL
でもまあ許容範囲でしょ。
あんまり縦割りなのもちょっとね。
0459Name_Not_Found
垢版 |
04/02/26 15:15ID:???
1 :笑門来福 :04/02/11 17:52 ID:???

Leinwand http://www.leinwand.jp/
amemix http://amemix.gogo.tc/
GIRLHOOD http://www.moon.sannet.ne.jp/rakugaki/
津波荘 http://www.ktsonline.jp/~minatsu/
2ndNewHouse http://www.ichigo.sakura.ne.jp/~2nd/
straywretchscrap http://sws.lib.net/
Y.Tsutanoontheweb http://www.tsutano.com/yutaka/

59 :Name_Not_Found :04/02/19 16:25 ID:???
>>1
・問題なし
・404
・問題なし
・問題なし
・JS切るとcss表示されない、alternate stylesheet設定無し
・切り替えられるの?
・JS切るとcss表示されない、alternate stylesheet設定無し
0461Name_Not_Found
垢版 |
04/02/26 18:10ID:???
>>459
どこの自演か一目でわかるラインナップですね。
0465Name_Not_Found
垢版 |
04/04/13 13:11ID:???
教えて下さい
スタイルシートの切り替えはJavaScriptでないとできませんか。
HTMLだけでは無理でしょうか。
お願いします
0467Name_Not_Found
垢版 |
04/04/13 13:34ID:???
link要素書いてれば
対応ブラウザなら一応できなくもないけど…>切り替え
あれだけだとちょっと辛い
0468Name_Not_Found
垢版 |
04/04/13 13:49ID:???
どちらにしろ閲覧する側に依存する。JavaScriptでもlink要素でも。
0469Name_Not_Found
垢版 |
04/04/13 18:43ID:???
PHPやCGIもあるけどね、あれも内部的にはjs使ってたりして?
0470Name_Not_Found
垢版 |
04/04/13 19:04ID:???
CGI 使ってるとこもあるけど Cookie 食わせたりしてるみたいだしなぁ。
どのみちHTML *だけ* では無理。
0471Name_Not_Found
垢版 |
04/04/14 22:40ID:???
>>470
だからMozillaやOperaなら対応してるって。HTMLだけで代替シートに切替可。
0473Name_Not_Found
垢版 |
04/04/15 04:19ID:???
>>471
でもページ切り替わってもちゃんと値を保持していて欲しいね。
あんまり切り替えた意味ないし。

>>472
おそらく。
0474Name_Not_Found
垢版 |
04/04/15 07:10ID:???
>>471>>473
Firefox ならページ切り替えても title 追っかけてるんじゃないかな。
ブラウザ依存しまくりなので HTML だけでは無理といえなくもない。
(閲覧者の環境に依存しまくるから作成者の意図通りにはならないってこと)
0475Name_Not_Found
垢版 |
04/04/15 13:26ID:???
>>474
Firefoxでも無理ですた。
コンテキストメニュー拡張にそういう機能がいちおうあるけど。。。
0477Name_Not_Found
垢版 |
04/08/01 19:04ID:???
Not Foundになる。無くなってしまったのか?

スタイルシート切り替え&リンクボタン「ス切リボ」
http://www.xinada.ne.jp/~handa/tech/CSS/SuKiBo
0478Name_Not_Found
垢版 |
04/08/01 21:10ID:???
だいぶ前になくなってたよ。てか1ヶ月放置でも生きてるのか・・。
Web制作板ってほんと過疎だな・・
0480Name_Not_Found
垢版 |
04/08/22 21:12ID:???

  ヤッホー お休みかなぁ〜〜?
0481Name_Not_Found
垢版 |
04/09/03 19:33ID:ehp0tlHa
javascript質問スレから誘導されてきました。

当方が使っているCSS切り替えスクリプトなんですが、
MacIEに対応していないんです。当方、Macを所持して
いないので、もし宜しければ、どなたかMacIEに対応
させる追加ソースを代わりに書いて下さいませんでしょうか。
宜しくお願い致します。

dat落ちしそうなのでageておきますね。
0482Name_Not_Found
垢版 |
04/09/05 13:28ID:???
>>481
とりあえず、今使ってるものを提示してもらわないことには
修正コードなんて誰にも描けないと思うぞ。

個人的には、MacIEに対応済みのスクリプトを拾ってくりゃ終わる話だと思うけど。
0483Name_Not_Found
垢版 |
04/10/06 19:06:33ID:???

  ヤッホー お休みかなぁ〜〜?
0487Name_Not_Found
垢版 |
04/10/15 04:55:17ID:???
はあ? スレッドを間違ってませんか。↑
0488486
垢版 |
04/10/15 05:33:12ID:???
間違えました。
0489Name_Not_Found
垢版 |
04/11/10 06:40:18ID:???
代替CSS選択Javascriptってフォームをdocument.writeで出してるのが多いからapplication/xhtml+xmlでは動作しないんだよな。
>>485のはOKだけど
0490Name_Not_Found
垢版 |
04/12/09 15:24:09ID:???
切り替えスクリプト使いたいんだけど、スクリプト云々の前にCSSのlinkにtitle属性指定したら、何故か一瞬だけしかCSS適応されなくてすぐに解除される・・・orz
title属性消したら普通に適応される。なんでだろう・・・誰か教えてください
0491Name_Not_Found
垢版 |
04/12/09 19:58:32ID:???
>>490
ページ読み込み後に切り替えてるスクリプトならチラつくことあるよ。
代替スタイルシートの設定の仕方あってる?
rel="stylesheet"でtitle属性が違うLINK要素が2つ以上とか無い?
0492490
垢版 |
04/12/10 15:05:00ID:AWeIYVva
>>491
それは大丈夫です。ちなみにIEだとちゃんと適応されました。Firefoxだと解除されます○| ̄|_
0493Name_Not_Found
垢版 |
04/12/14 17:35:35ID:???
チラつきはIEでもOperaでもGeckoでも起こる。
CSSのサイズが若干大きいとHTMLレンダリングの開始にCSS読み込みが間に合わなかったらチラつく。
レンダリングが開始される前にCSSの読み込み(キャッシュ含)が終わっていればチラつかない。
0494Name_Not_Found
垢版 |
04/12/17 17:56:18ID:???
一昨日くらいまで490とまったく同じ症状だった。
IEとかネスケでは大丈夫なのに、Firefoxだと、
一瞬だけCSS適応されてすぐに解除される。
だけど、今日まで忙しくてサイトに触れていなかったら、
急にちゃんと適応されるようになった。
もともとHTMLやCSSに問題はなかったし、
ブラウザがなんか故障したんだろう程度にしか
思わなかったが
0495名無しさん@修業中
垢版 |
05/01/06 15:44:33ID:OHFebcH/
JSの切り方を教えてほしい
0496Name_Not_Found
垢版 |
05/01/06 22:20:11ID:???
普通にオプションで切れる。
IE ? まだそんなもん使ってんの?深い場所にあるからよく見ろよ
0497Name_Not_Found
垢版 |
05/02/20 16:12:55ID:bsIzVx3F
ほす
0498Name_Not_Found
垢版 |
05/03/09 07:01:28ID:tRBPRqcJ
googleの検索結果でnewwindow=1にしてもキャッシュや関連ページは
新しいウィンドウにならないんですが、ユーザスタイルシートで
こいつらを新しいウィンドウで開くように出来ないでしょうか?
ブラウザはIE6です。
0499Name_Not_Found
垢版 |
05/03/09 11:30:48ID:???
スタイルシートを何だと思ってるんだ。
0502500
垢版 |
05/03/09 13:41:50ID:???
Shift+クリックの間違いですた。orz
0504Name_Not_Found
垢版 |
05/03/09 14:43:51ID:???
そんな事言われても…。
フレームの構成はページスタイルともいえなくもないし、
複数ページだって文書スタイルといえなくもない…
とかなんとかようするに何らかのHTML書換えフィルタとか
ブラウザの振る舞いで対処するしかないわけですね?
firefoxなら拡張で何とかなるかな?
ごみんね。じゃ、時間だしこの辺で。
0505Name_Not_Found
垢版 |
2005/04/12(火) 13:43:12ID:???
クッキーで代替
ttp://ramutei.com/
0507Name_Not_Found
垢版 |
2005/11/04(金) 21:40:53ID:???
読み込ませる限度って、最大でいくつぐらいまで?
調子に乗って5つもCSSを用意してしまったが……
0508Name_Not_Found
垢版 |
2005/11/05(土) 01:43:27ID:???
>>507
うちは三つ
head部分やmenu、footer部分などのメインCSS
中身の制御のCSS、
その他なんかてきとうにCSS
0509Name_Not_Found
垢版 |
2005/11/05(土) 08:56:58ID:???
>>508
分けてるのね
>>507
漏れ全部のスタイル入れ込んだ代替CSSを10くらい読み込ませてるよ・・・('A`)ダメナノカナ
0510Name_Not_Found
垢版 |
2005/12/14(水) 17:25:44ID:lSAMgByS
>>509
IEは代替スタイルも全部読み込んでから表示する。
ので、重くなるぞ。
0511Name_Not_Found
垢版 |
2005/12/14(水) 20:58:14ID:???
>>510
げっ。マジで?
優先スタイルシート読み込んで表示開始、だと思ってた。

トップのHTML自体は4KBのサイトだけど
代替CSS・背景画像ふくめたら80KB超えてるよ
どれを削ろう……
0512Name_Not_Found
垢版 |
2005/12/14(水) 22:54:02ID:???
>>511
PHPのスクリプトなら問題ないよ。
選択されているCSSしか読み込まないから。
0513Name_Not_Found
垢版 |
2005/12/15(木) 00:36:51ID:???
本来は、linkタグにalternateスタイルシートを記すのが、筋。
0516Name_Not_Found
垢版 |
2005/12/19(月) 14:11:51ID:???
>>515
むしろお前が失敗しているのにワロスw
0517Name_Not_Found
垢版 |
2005/12/20(火) 15:00:54ID:???
ほんとだよ。書き込み確認FLOWと刺さないと駄目だな
0518Name_Not_Found
垢版 |
2006/01/28(土) 11:06:51ID:u25r89pC
ハゲドー
0519Name_Not_Found
垢版 |
2006/03/09(木) 00:47:02ID:???
一つ代替スタイルシートを作ったので寝る。
完成していないけど。
0520Name_Not_Found
垢版 |
2006/04/02(日) 20:21:03ID:???
ユーザスタイルシートで文字の大きさを制限したいと思っています。

FirefoxやOperaは最小フォントサイズを指定できますがこれだけでは不満です。

個人的に一番理想的なのは、たとえば最小9pt〜最大14ptと指定したとして、
そのページにある最小〜最大サイズまでのレンジを自動的に制限レンジの
9〜14ptに内比を保って変換してくれる事です。

CSSではこんな事はできるはずもないので、これに近いことをしたいのですが
何か良い方法はないでしょうか?
最大サイズの指定できるだけでも構わないのですが…。

現在はIE6やOperaでは全て固定サイズにするユーザCSSを使用しています。
これはこれで悪くないのですが、できれば避けたいです。
Firefoxだけは最小フォントサイズ指定とデフォルトフォントサイズだけで、
ユーザCSS無しでなんとか我慢できる範囲になっているようです。
0521520
垢版 |
2006/04/02(日) 21:39:34ID:???
Opera9P2はOpera:configとやるとmax_fontsizeという項目が有った…。
あとはIE6だけだ…。
0524Name_Not_Found
垢版 |
2006/09/03(日) 01:14:59ID:6CJfsvG1
このスレまだあったんだ
0525Name_Not_Found
垢版 |
2006/10/13(金) 17:15:25ID:???
保守してみる。

みんなどんな代替用意してる?
当方は
・基本(青系)
・白黒(読みやすさにより配慮)
・黒板風(目が疲れない?)
・ピンク系(かわいい)
・2ちゃんねる風(ネタ)
の5つ。
元がかなりストリクトでタグの種類も少ないミニマムなHTMLなんで、
シートも少ししか書かなくていいから手軽。
レスを投稿する


ニューススポーツなんでも実況