元スレjQuery ライブラリ総合質問所 vol.4

JavaScript覧 / PC版 /

みんなの評価 :

前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ

/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで

451 = :

冷静に考えてここで争っても無駄ってわかるだろｗ
お前らの会話なんてどうせあと3日もしたら頭から消えるんだろ？
ここで決着なんて付くはずもないんだし、その時間とエネルギーを
node..jsにでもそそぎ込め。

452 = :

うむ、こんだけこのスレ見てるなら質問者来たら相手してやれと。
回答者にケチじゃなくてさ。

453 = :

>>424
FireQuery

454 = :

jQueryのUI-Dialogでもし分かれば教えてほしいのですが、
たまたま見つけたこのページなんですが、

http://mgate.info/wp/wp-content/uploads/2013/12/dialog_test.html
(http://mgate.info/program/jquery/154/ の記事内のリンク先)

一番右下の [ダイアログ表示]を押します。
開いたダイアログで[キャンセル]を押すと、下図のダイアログが開きます。

--------------------------------
| メッセージダイアログ　　　　[Ｘ]
--------------------------------
| キャンセルがクリックされました
|
--------------------------------

この時、[Ｘ]ボタンの周りに青い長方形が表示されるんですが、

┏━━┓
┃[Ｘ]┃
┃　　┃
┃　　┃
┗━━┛
のように下にビローンと伸びていて見た目が変なんです。
Chromeでのみ起こりました。IE,FFでは起きません。
些細なことなのですが、こういうのはどうやれば回避出来ますか？

455 = :

>>454
↓これをCSSの中に追記で治る。

.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text {
padding:0;
}

あなた最近よく色々な所に書き込んでるね。
WEBは最近覚えたての元サーバー・DB系エンジニアかい？
jsはそこそこ覚えたらphp+MySQLをやるといいと思うよ。

456 = :

>>455
ありがとうございました。治りました。
助かりました。
ＤＢは全く経験ありませんが勉強したいです。

457 = :

458 = :

>>457
URLがhttpでもhttpsでも
問題なく読み込めるようにするためです。

459 = :

>>457
http://re-dzine.net/2012/05/google-htmlcss-style-guide/

埋め込みリソースからプロトコル表記（http:,https:）を省略する。

<script src="http://www.google.com/js/gweb/analytics/autotrack.js"></script>


<script src="//www.google.com/js/gweb/analytics/autotrack.js"></script>

461 = :

>>458 >>459
そういうことですか！ありがとうございました。

462 = :

>>460
の言ってることがわからないのだが、誰かわかる？
もう少し、今まで、変更したことなど状況を書いてくれないと
エスパー回答しかできないのでは

同時にとは1行で2つを読み込みたいと？

463 = :

しゃあない。じゃあ俺がエスパーしてあげよう。

>>460
jsの競合の事を言いたいのだろうけど、下記のバージョンの組み合わせにしたらいい。

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

※念のため　http://～　にしておく

出来ている例：http://jqueryui.com/tabs/

464 = :

それでも動かないならスクロール固定とやら（恐らくフローティングだろう）の
jsファイルの読み込む位置を上記の後ろにして試してみて。（既に後なら先にしてみる）
（jquery/1.7.2は不要）

例
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="/以前設置してたスクロール固定.js"></script>

ソレデモダメナラソース開示しないとわからん。クラス名ID名の重複も考えられる

465 = :

最近はjQuery-uiとか既製品の質問ばかりだな。
しかもCSSの問題だったりがほとんど。

以前のようにセレクタやトラバーシング系の質問やネイティブなjs絡み（配列だの分岐だの）の質問がないのは、
衰退を表しているのだろうか。

466 :

すまん、>>460の質問をしたものだが、>>463のいう「Jクエリの競合」のことが言いたかった；
拙い説明ですまん。

とりあえず出先だから取り急ぎ回答のお礼を…

467 = :

>>465
そういうのはJavaScriptのスレでやってるよ。

468 = 466 :

>>464
おおおおお！！！！！
すげぇそのまんまやって順番変えたら出来たわｗｗｗ
読み込む順番変えると挙動変わるのか知らなかったwww
ありがとう！！！

469 = :

今宵もエスパー的中しますた。
>>467
そっちはネイティブすぎる。jQuery手打ちの質問が無くなったなあって事。
例えば、各href属性の末尾にURLクエリ情報を要素から取得して動的に入れるには・・みたいな。

<div id="hoge">
<a href="/page/111.html">111</a>
<a href="/page/index.html">222</a>
<a href="/page2/index.html#top">333</a>
・
・
↓
jQueryで動的にこうするには
<div id="hoge">
<a href="/page/111.html?page=111">111</a>
<a href="/page/index.html?page=222">222</a>
<a href="/page2/index.html#top?page=333">333</a>
・
・

470 = :

http://jqueryui.com/dialog/
のサンプルのBasic Dialogを実行すると、
ダイアログが親ウインドウの領域に制限されます。
その結果、ダイアログの一部が親ウインドウからはみ出すなどが出来ません。

その制限を解除することは可能でしょうか？
はみ出した部分は表示されなくても構わないので。

471 = :

>>469
それはサーバサイドでやるべき
しかも、jQuery特有の問題でもない

472 = :

>>469
伊藤さん、すごいわ
今後コテハンで頼ま

473 = :

各要素に各メソッドで操作をする
例えば下記のようなものが多くある場合

$('#aaa').click(function(){
　$(this).show();
});

$('#bbb').click(function(){
　$(this).remove();
});

$('#ccc').click(function(){
　$(this).fadeIn();
});

$('#ddd').click(function(){
　$(this).slideUp();
});

各要素の数だけイベントを書かなくてはなりません。そこで
・各要素（#aaa～）にattrやdata-など何でもいいのですが"show()"などの文字列を書き
・各要素（#aaa～）を全て".all"と同名にしてしまい

$('.all').click(function(){
　$(this).～（そのメソッド文字列読み込み）～.～（そのメソッド実行）～;
});

などとまとめてしまうことはできますか？

474 = :

>>473
できなくはないけど、やめた方がいい。なぜならコードが複雑になるから。

複雑とはなにかって話をすると、
複雑っていうのはひとつの関数（クラスとかでも同じだが）が
複数の役割（責任ともいう）を持っていること。
一つの関数は一つの責任だけを持っている。こういうのがシンプル。

今回の場合、.allクリックのイベントハンドラの中に複数の処理が入ってしまっている。これは複雑。
例えば、data-なんたらのshow()の所だけを修正する必要がある時にそれとは無関係のコードの
影響まで考えなくてはならなくなる。それではメンテナンス性が下がる。
またJavaScriptを書いている時に、いちいちHTMLのdata-を見ないといけなくなるので面倒

共通の関数にするならば、原則として同じ処理をしている場合のみ同じにする。

その例では、何と何を、どういった理由で共通にしたいのかとかの情報が抜けてる。
その話だけからだと、まとめないほうがいいとして言えない。

まあヒントを言うならば、同じ処理ならば、以下のようにしてまとめることもできる。
$('#aaa, #bbb').click(function(){
　$(this).show();
});

また、こういう書き方もできる。
function show(){
　$(this).show();
}
$('#aaa').click(show);
$('#bbb').click(show);

こんなやつを使えば、あんたが抱えている本当の問題は解決するんじゃないの？

475 = :

>>473
知恵袋に同じ質問あり
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q13149185623

476 = :

470誰かお願いします。
要するに使わない時にダイアログを横にどかしておきたいんですが、親ウインドウ枠から出られないので、困ります。

477 = :

>>474
複雑は承知ですし、複数の処理前提のページなので問題ないです
逆にその方が単純化されるページなのです

例だとshowしかできませんが？

>>475
ありがとう
ざっと見ただけですがこれからじっくり調べてみます

478 = :

470ヨロ

479 = :

>>478
そのデモじゃなく実際やってみたらいい

480 = :

だよな
iframeの中に置かなきゃいい

481 = :

>>479
どういうパラメータを変更すればそういう事が出来るのか見当もつかないんですが。
そもそもこのダイアログの挙動を制御するどういうパラメータが有るのかを調べる方法が分かりません。お手上げ状態です。

482 = :

>>480
ああ、それは試しました。
でもダメでした。

483 = :

もしブラウザの外まで移動できると思っているなら根本から間違ってるｗ

484 = :

>>483
外に持って行くのは出来ないと思います。
はみ出した部分は描画されなくても良いので大きく横に動かしたいんですが。

485 = :

サイズ変更させるボタンでも付けてスタイルをトグルさせればいいじゃんｗ
というかモーダルダイアログの意味を何か履き違えてる気がするｗ

486 = :

>>485
モードレスにもなりますよ。

487 = :

そのデモの例でいけばleftの値を-280pxにでもトグルさせるボタンでもつけときゃいい

あるいはタイトル部分をダブルクリックするとコンテンツ部分の表示/非表示をトグルさせるとかな

こんなのはブラウザの開発ツールで簡単に実験できる

488 = :

>>487
そういう細工する方法ではなくて、自然にドラッグして移動したいんですが。
無理そうですね。

489 = :

>>488
>>470の親ウインドウとはどっちを言ってる？

1. デモの移動範囲である四角 → >>479
2. ブラウザのウインドウ → >>483

490 = :

>>489
ブラウザです

ダイアログを使わない時は、ちょっと横にどかしておくなどが出来ないと不便ですよね。

491 = :

そういうのは別のＵＩ要素な気がするけどまあいいや

492 = :

>>490
面倒だからこれでいいだろ

alert('メッセージ');

493 = :

>>490
optionには特になさそう（たぶん）
http://api.jqueryui.com/dialog/#option-modal

このUIでデフォなら
window.open();
でサブウインドウ出せばいいかと

jQのこのUIでないとだめな理由ある？

494 = :

何かの参照だけが目的ならそれで十分だよな

495 = :

>>493
jqのこのuiで出来るならそれに越した事は無いんですが、出来ないならwindow.openでやろうかな

496 = :

要素の位置や幅や高さをjQueryで求めると数値では無くてautoという値が帰る場合が有りますよね。
そういう場合でも画面上ではその要素の位置もサイズも確定している訳だから、その数値を取得する方法有りますか？

497 = :

あります

498 = :

>>497
教えてケロ！

499 = :

>>496
> 要素の位置や幅や高さをjQueryで求めると数値では無くてautoという値が帰る場合が有りますよね。

普通はjQueryの方法で求めるとピクセルで取得できるはずなんだが、
お前どうやって取得してるんだ？

500 = :

ドキュメントぐらい読めるようになろうな

.width()
.height()
.position().left
.position().top