>>542
今更見てないかも知れないけど...
サンプル:
　ttp://homepage2.nifty.com/alter/exam/price/exam.html
js:
　ttp://homepage2.nifty.com/alter/exam/price/exam.js

>>546
jQuery とかを使うという条件ならアッシの出番はないのよね.
black-box は嫌いなのよん. (負け惜しみくさいけど)

>551
返答ありがとうございます。
もっと色々調べて頑張ってみます。

>>552
お役に立てませんで.
方法は一つでないから
jQuery を使わないで良いのならサンプル作れると思うよん.
たとえば CGI と連携させて .js としてデータを吐き出させるなんてのも可能.
cookie と違って誰が見ても同じ条件を再現できたりして...

>>553
いえいえとんでもないです。
jQueryのバージョンを変えたらできました。
しかしバージョンを変えなければならないことによってまた新しい問題が発生してしまいました…


ということでcookie以外の保存方法を探してみます。
CGIはあまりわからないんですが、何か良い方法があるんであればご教授お願いします。

>>554
ちょっと時間掛るかもしれませんがサンプル作って見ます.
でも,今日は もう寝ます.

>>554
寝る前に...
掲示板 CGI の中にはデータを加工して HTML ファイルを吐き出させるものがあります.
同様にして ".js", ".css" に加工することだって可能なはず.
この発想は自作掲示板で実験済みなのです.

".css" に加工して吐き出させるのが
web-browser の差異を回避させるのに有効な方法かも ?

>556
cookieでなくCGIでデータを取得したほうが良さそうですね。
今私がやろうとしているのは簡単なCMSのようなもので、要素の位置や背景の色など全て保存できるようなCGIを考えてみます。

>>554
>また新しい問題が発生してしまいました
具体的に どういうことでしょうか ?

>cookie以外の保存方法
"保存方法" というのとは ちょっと違う気がしますが,
ターゲットのポジション情報(css) を CGI に渡して
.css を動的に吐き出させてしまうことを考えてます.

ただ, ここで問題となるのは JavaScript での event 操作.
　(Mozilla 系と IE系とは記述が異なる)
　(IE は 相変わらずグダグダと独自路線)
困ったことにはアッシは IE での動作確認が出来ないんですよぉ.

ここで提案:
早い話が分業です:
CGI: あっしが作ります(とりあえず nifty で動作するものを)
CGIに渡す CSS データ: 貴方が作ってください.
(input type="hidden" にデータをセットするまで もしくはその直前まで)

どうですか ?

>>558

>>また新しい問題が発生してしまいました
>具体的に どういうことでしょうか ?

jQueryの話になってしまうんですが、バージョンが1.2.3だとcookieは保存できるんですが、live関数が使えない。
バージョンが1.3.2だとlive関数は使えるけど、cookieが保存できないというものです。
そもそも、簡易版CMSを目指すならばcookieではダメだとわかりました。
気づくのが遅いですが。

私も動作確認はFireFoxでやっています。

すみません、CSSデータの作り方がわからないです。
たとえば、要素の位置のデータでしたら
<input type ="hidden" value="ui.position.top">
<input type ="hidden" value="ui.position.left">
のように羅列すればいいんでしょうか？


いまさらなんですが、ホームぺージ作成に関して私はまだまだわからないことだらけです。
ですので理解できずにおかしなことを言っていると思います。
申し訳ないです…

>>559
ホント？
今手元で動かしたけど、IE6, chrome4, Firefox3.6は問題なくリロード後も保存できてるよ
jQuery1.4.1
jQueryUI1,7.2

サーバにあげずにローカルの環境でやってるってことない？

>>560
え？ホントですか？
ローカルでやっています。

ちょっとサーバーで試してみます。

jQueryていつの間にか1.4.1になってたのか！

>>563
あと、$(function(){})が何個もあるのは気持ち悪いのと
$関数を何度も使うのは効率悪いだろうと思うので
まとめられるところはまとめちゃった方がいいんじゃないかと思う。

$(function() {
　　var $myDrag = $('#myDrag'); // 要素は一度だけ探す

　　$myDrag.draggable({
　　　　opacity : 0.5, //ドラッグ時の不透明度
　　　　cursor : 'move', //カーソル形状
　　　　containment: '#maincol',//移動範囲制限
　　　　stop: function(e, ui) {
　　　　　　var posOfMyDrag = ui.position.top + "\t" + ui.position.left;
　　　　　　
　　　　　　$.cookie("posOfMyDrag", posOfMyDrag, {expires:30}); // top,left をまとめてクッキーに保存
　　　　}
　　});

　　var posOfMyDragCookie = $.cookie("posOfMyDrag");
　　if(posOfMyDragCookie) {
　　　　var posOfMyDrag = posOfMyDragCookie.split(/\t/); // top,left をバラす
　　　　$myDrag // top,left をまとめて設定
　　　　　　.css("top", posOfMyDrag[0] + "px")
　　　　　　.css("left", posOfMyDrag[1] + "px");
　　}
});

>>565
確かにcookieはまとめて保存した方が良いですね。
ホント勉強になります！
ありがとうございます！！

>>559
問答無用のサンプル:
　ttp://homepage2.nifty.com/alter/exam/d_style/exam.html
js:
　ttp://homepage2.nifty.com/alter/exam/d_style/exam.js
(自作掲示板用の sub routine を転用したので極めて簡単でした)

･ variable "css" の部分を変えれば CGI に渡す内容を変えられます.
･ local からでも post できてしまうので このまま使うのは問題あるかも ?
(穴に気付いたら教えてちょうだい !)

あと, どなたか 自作掲示板の動作確認をお願い _(._.)_
(改行コードの関係で windows では動作不良を起こす可能性がぁ～)

･ chache の関係で reload する必要があるかも ?

>>567
本当にありがとうございます！！
すごいです！！
これをもとに色々できそうです！！

CGI部分のソースって
http://hpcgi2.nifty.com/alter/exam/emit.cgi
をコピペすればいいんでしょうか？

一応CGI使用可能のサーバをレンタルして同じものを再現しようとしてるんですができなくて…。
ホントに素人ですみません。

>>569
"もしかして お呼びでないかも ?" と思ってました.

>CGI部分のソースって
>をコピペすればいいんでしょうか？
外部からソースが見え見えな CGI なんて危なくて使えません.
適当に作ったとは言え,
それくらいの配慮を欠くようでは困ったちゃんの仲間入りです.

ソースを公開しても良いですが,
そのためには あと少しの改良が必要かと.
(local からの post を受け付けるようでは たぶん問題アリ)

>CGI使用可能のサーバをレンタルして同じものを再現しようとしてるんですが
それでは そのサーバーを教えてください.
(flock() を使えるサーバーかどうか注意が必要) <- 使えない場合は変更の必要あり.

それと "emit.cgi" の正体は単なるコントロール ルーチンです.
(受け取った内容を "dynamic.css" というファイルに書き込んだあとダイアログを出す)
(あと 2 つの .pl ファイルに基本的ルーチンが...)
ともあれ, やりたいこと("簡易 CMS" が どのようなものか) を
知る必要があると思います.

それに合わせてカスタマイズをする用意があります.

>>569
念のために.
(極めて当たり前な話なので 解っているのなら読み飛ばしてちょうだい)
CGI に データを渡す方法は {"get", "post"} の 2 つ.
　1. "get" の場合: 渡すデータが query string として URL に付け加えられる
　2. "post"の場合: input field の {"name", "value"} の対の形で処理される.

"get" でデータを渡す方法は渡すデータが見え見えなので
通常は parameter, command を渡すために使われ,
password などを渡すには "post" でやるのが普通です.

"emit.cgi" のようなケースでは
渡すデータに見られて困るようなものを含まないので
どちらでも良いのですが
あっしは "post" 以外を受けつけないように作ってます.

>>570

>"もしかして お呼びでないかも ?" と思ってました.
とんでもないです。
こんなアホにお付き合いくださってありがとうございます。

>それでは そのサーバーを教えてください.
PF-X.NETというところのを使っています。

>ともあれ, やりたいこと("簡易 CMS" が どのようなものか) を
知る必要があると思います.

ページを開くと白紙の状態なんですが、”画像追加”や”テキスト追加”などのボタンを設置しておきます。
その後画像や文章などを追加して、自由に要素のリサイズやドラッグができるといったものです。
そういった部品をページに組み込んでひとつのホームページに見えるようにしたいと思ってます。
説明が下手くそですみません。


色々とご説明ありがとうございます。
ホントに勉強になります！！

>>572
>PF-X.NET
無量で広告なしとは魅力的な...
ただ, Google でヒットしたページは weblog?
調べ方の問題かもですがサーバーの詳細のページには たどり付けず...
(weblog ってゴミゴミしていて目的のリンクがどこにあるのか判りづらくね ?)


>{"画像追加", "テキスト追加"}
これらの出所はどこなのでしょうか ?
また, 文面からは "追加" の操作を客人にも許可するように読めます.
(そうだとすると単に css を動的にいじるだけのものではなくなり...)

時間がないので詳細はお昼に.

>>573
>これらの出所はどこなのでしょうか ?
>また, 文面からは "追加" の操作を客人にも許可するように読めます.

昨日PHPを少し勉強したのでPHPで追加しています。
掲示板を改変した感じです。
客人も好きにいじれるようにしたいです。

お時間ないところありがとうございます。

>>573
http://www.pf-x.net/pukiwiki/index.php?%A4%E8%A4%AF%A4%A2%A4%EB%BC%C1%CC%E4%A1%A7CGI%2CPHP%B4%D8%CF%A2#cgifdelete
　: PF-X.NET FAQ:

http://www.pf-x.net/pukiwiki/index.php?%A5%B5%A1%BC%A5%D3%A5%B9%CD%F8%CD%D1%CA%FD%CB%A1%A1%F5FAQ
　: サービス利用方法:

･ CGI のファイル構成: {emit.cgi, init.pl, process.pl, ./tmpl/dialog.html}
　同一 directory にまとめて置いてください.

･ 最初に問題となるのが " perl path" と呼ばれる先頭の一行.
　上記リンク先の説明によれば は #!/usr/bin/perl のみ
　(すでに変えてあります)

･ 次に問題となるのが "init.pl" <- file_name, path などの定数ファイル.
　説明は実物を見てもらってからの方が良いのですが.
　{ "$pub0", "$pub1", } を変更(書き加え) してもらう必要があります.
　そもそも nifty のややこしい path 指定に特化しているので
　変更の必要がありますが..., 上記リンク先の説明では なんとも....

ともあれ, CGI ファイルはこれから圧縮, upload の運びとなります.

>>573
http://homepage2.nifty.com/alter/upload/dynamic_ss.zip
　perl script file

･ "$pub0" (public0) : server から見た path
･ "$pub1" (public1): いわゆる URL

両者が異なるのが nifty のクセなので変更しないと誤動作を起こします.
例えば xrea では これらの違いがなく,
さらに CGI の置き場も無制限です. (レンタルスペースのどこでも お～けい)
したがって xrea では いわゆる相対 path が使え, 両者の違いはありません

さて, PF-X.NET の場合は基本的に
/cgi-bin/ directory 置く決まりとなっている模様.
(どうやら便宜的な directory で delete 可能らしい)
おそらくは xrea と同等に相対 path が使えるものと予想されます.
しかし, 試して見ないことには判りません.

念のため, perl での double quote は js と違って
特別な働き(展開して解釈) がありますので
これを single quote に書き換えると多くの場合動かなくなります.

蛇足:
CGI script をいじることなく html, js の変更だけで こんなことも:
　ttp://homepage2.nifty.com/alter/exam/d_style/exam.html

>>572
たぶん upload した script は間違いなく動作不良を起こすはず.
一般サーバー向けにすっきりした記述に直す必要がある.
うまく行かなかったら迷わず ここに そのむね申し出て欲しい.

public と cgi-bin とで相対 path が使えるかどうかが重要であるあります.

訂正:
public と cgi-bin とで相対 path が使えるかどうかが重要な情報です.

あと, text field の内容をチェックする機能を js に付け加える必要がありそう.
ダメージが深刻な いたずらは できないはずだとは思いますが...
思いがけない穴がある可能性も否定できないので用心するに越したことはない.

だれか～動作確認してくれ～お願いだから～
　ttp://homepage2.nifty.com/alter/bbs/index.html

･読めるかどうか
･書きこめるかどうか
(改行コードの関係で bug 発生することが想定される)

さっそく動作確認に協力してくださった方がおられるようで..
ありがとうございます !
思いがけない bug を発見できました.
自分一人では絶対に気付くことはなかったと思います.

(input type="hidden" に放り込んだデータを読み込む時点で
"<", ">" が復活してしまうらしい...)

ところで あっしが upload した perl script のその後は ?
極めて単純なので改造は楽なはずだけど...
(個人的にコメントだらけの script は むしろ読みづらいと思う)
(それよりも無駄を削ぎ落とす努力を重視...)

レス遅れました。

なにから何までホントにありがとうございました！
色々と勉強になりました！！

post後のURLがhttp://homepage2.nifty.com/alter//index.htmlになるね。
あと、上部のナビゲーションにhistory.back()とだけ表示されることも。
掲示板機能以前に、外観も含めて、ユーザビリティに難があると思うけど、いかが。
と言うか、上述のことくらい自分で少し使えば見つかると思うが。テストしてんの？

>>585
レポートありがとうございます.

>post後のURLが
ん?
もしかして path 関連の bug ???
そうだとすると根本的な問題...
もう一度洗い直して見ます.

>上部のナビゲーションにhistory.back()とだけ
おそらくは dialog template で error 処理の後に使われるものかと.
リンクにしていないのには訳があるのですが
クリックして元の form に戻れるとと判る人は作った本人だけかも ?

>掲示板機能以前に
そ, それが機能的部分の bug を探している状態なので...
(先に指摘されたような問題も潜んでいそうだし)
まずは最低限の信頼性を確保できないことには.

>外観も含めて
>ユーザビリティに難が
一番気になる部分なので
具体的に率直なご意見を伺いたいです.

>>584
間違いなく動作不良を起こす予定だったのですが,
うまく行ったのですか ?

>>585
>post後のURLが
あの～, どういう状態のときにそうなるのか おせ～て !
(たぶん dialog を出した時だと思うけど...)
書きこみが正常に終わった後には
/bbs/index.html に戻るはずで誤動作を再現できず.

UA の問題は template の書換えだけで対処できるので
素早く対処できる自信が...

>>585
>post後のURLが
あの～, どういう状態のときにそうなるのか おせ～て !
(たぶん dialog を出した時だと思うけど...)
書きこみが正常に終わった後には
/bbs/index.html に戻るはずで誤動作を再現できず.

訂正:
UA の問題は -> UI の問題は

そして ひとりぼっち... (はぁ)

記事ごとの CSS 設定機能付けて見ますた.
　ttp://homepage2.nifty.com/alter/bbs/index.html

Amazonのリストマニアの汚いURLを整形するブックマークレット誰か作ってください
個別の本のURLをキレイにするものなら既にあるんですが、なぜかリストをキレイにしてくれるのがありません

>>592
>Amazonのリストマニアの汚いURL
"get" request の (encode された) query string の事を言ってるのかな ?

>>592
自分で作ったリストマニアのこと？それとも他人のリストマニアってこと？
どういう意図でキレイにしたいかわからん

>>595
オンラインブックマークするときは自分のブラウザのブックマークレットから？
リストマニアにブックマークボタンないよね？

流としては

誰かのリストマニアの一覧を見る　※1 ここで個々の商品をブックマークしたい
↓
リストマニアの中から人つ商品を選ぶ　※2 ここでその商品をブックマークしたい

のどっちかだと思うのだけどどっち？
URLの正規化自体は
astore.amazon.co.jp/[アフィリエイトID]/detail/[ASIN]（この後もしかしたら何か付く）
だと思うからどうにかなると思う

ブックマークレットやアドオンなどでやってます

http://www.amazon.co.jp/lm/RY2ZXSYWGI2L8
こういうページを開いて見てる最中に、ブックマークしたいという事です

>>597
そういうやつか。astore.amazon.co.jpの方かと思った。
ブックマークレットをやっつけで作った。xpath使った方が楽だなと思ったけどIEで念のため動くように。
ブックマークレットにして実行するか、アドレスバーに貼りつけて実行すると
canonicalってリンクが画像の上あたりに出るはず
（書き込むときに行が長すぎるって怒られたからコピペして改行消して。）

javascript: (function(){ var amazonUrlBase='http://www.amazon.co.jp/gp/product/';
var inputs=document.getElementsByTagName('input');
for (var i=0,l=inputs.length;i<l;++i) { var input=inputs[i];
if (! /asin[0-9]+/.exec(input.name)) continue; var a=document.createElement('a');
a.href=amazonUrlBase + input.value; a.innerHTML='canonical';
input.parentNode.insertBefore(a, input); } })();


元のjavascriptは下のような感じ
(function(){
var amazonUrlBase = 'http://www.amazon.co.jp/gp/product/';
var inputs = document.getElementsByTagName('input');
for (var i=0,l=inputs.length;i<l;++i) {
　　var input = inputs[i];
　　if (! /asin[0-9]+/.exec(input.name)) continue;

　　var a = document.createElement('a');
　　a.href = amazonUrlBase + input.value;
　　a.innerHTML = 'canonical';

　　input.parentNode.insertBefore(a, input);
}
})();

説明下手で伝わってなかったかもしれません
リストそのもののURLをブックマークするんです
http://www.amazon.co.jp/%EF%BC%92L%E3%81%AE%E3%81%8A%E8%8C%B6%E9%81%94/lm/RY2ZXSYWGI2L8/ref=cm_srch_res_rpli_alt_1
を
http://www.amazon.co.jp/lm/RY2ZXSYWGI2L8
にワンタッチで整形したいって事です

>>599
あぁ、なるほど。おもいっきり勘違いしてた。
これでどう？ナビの下辺りにリンクが出来る。
ブックマークするときは右クリックとかでするんでしょ？

javascript: (function() { var baseUrl='http://www.amazon.co.jp'; var match;
if (match=/(\/lm\/[a-zA-Z0-9]+)/.exec(location.href)) {
var a=document.createElement('a'); a.href=baseUrl+match[1];
a.innerHTML='canonical'; document.getElementById('navbar').appendChild(a); } })()