4
票
ドラッグすると10pxずつ動く要素を作りたい
JQuery UIのdraggableで全ての条件を満たすことができると思います。
$("#draggable").draggable({
axis: "x", // 縦には動かせない
grid: [10, 10], // 横には10pxずつ動かすことができる
containment: "#container", // 指定した範囲を超えることはできない
snap:...
2
票
Accepted
jQueryのanimate()メソッドが条件文の際にうまく動作しない。
条件文は逆でないですか?(記載内容とコード上の動きが逆の気がします。)
mousemoveイベントは絶え間なく発生しますので、このままだとanimate中にanimateさせることになってうまく動きません。
if($('#box1').is(':animated')) return;
を入れて、animation中には判定を行わないようにしましょう。
すでにleft: ...
2
票
Accepted
半透明になったboxがドラッグできなくなる。
box の重なり順序で後ろになるためだと思います。
z-indexを指定してみてください。
例:
<style>
.dragbox {
/* 他の指定 */
z-index:1; /* 数値が大きいほど「前(上)」になる */
}
.dropbox {
/* 他の指定 */
z-index:0;
}
</style>
状況再現スニペット
$(...
1
票
Accepted
jQueryとjQuery UI でアニメをさせたところ,何故か無限に繰り返してしまう
mouseoverとmouseoutが実行した分繰り返されているだけで無限ループではないです。
それぞれの仕様を確認してみましょう。
ポイントは「バブリング」のありなしです。
mouseover
mouseout
バブリングはイベント周りでは重要な要素になるので是非学んでおいてください。
簡単にいえば「子要素のイベントが親要素にも伝搬する」
...
1
票
Accepted
jQuery-uiのDatepickerでのカレンダーの初期値ハイライト方法について
詳しく内部の実装を知っている訳では無いのですが
defaultDate は、本日ではないので、本日日付のスタイルをオフにするわけではないようです。
なので、もしオフにしたいのであればそのように設定する必要があります。
指定日をハイライトするというような直接的なAPIは無いようですが、
各月の日付が表示される前にbeforeShowDay が設定のために呼び出されるのでそこでスタイル(...
1
票
Accepted
jqueryのセレクトボックスで別メソッドで値が変更されても処理が動いてくれない
jQueryのchange()はHTML規格で定義されている'change'イベントそのままですので、ユーザがフォームコントロールの値を変更したときのみ発火します。
JavaScriptから値を変更した場合は発火しませんので、値を変更するコードで明示的に処理を呼んであげる必要があります。
$('#' + index + '_tmpid').val(...);
...
1
票
Accepted
jQueryUI Dialogを複数開いた場合のz-indexの制御
最後に開いたオーバーレイは$(".ui-widget-overlay").last()で取得できそうです。
ただ子ダイアログは自動的に孫ダイアログの後ろに隠れているようです。
下のスニペットでは、ダイアログ内のボタンをクリックすると子ダイアログ開きます。
ダイアログを開いている状態でオーバーレイ(ダイアログの外側)をクリックすると、
クリックしたオーバーレイのz-index
と、
$("....
1
票
jQuery mobileでタブバーを実装したい
TOP Pageの</section>のあとにナビゲーションバーをフッターとして追加してください。
<!-- TOP Page -->
<div data-role="page" id="TopPage">
<header data-role="header" data-position="fixed" data-theme="c">
...
1
票
Accepted
JSである数式をグラフ化した時の外側を隠す&シャドウをかける
要素の切り抜きに限って書きます。
Canvas要素や、SVG要素の中でしたら当然の事ながら何でも出来ます。
しかし、任意のHTML要素の形を自由に操るのは、今の所いろいろ面倒くさいです。
CSSとSVGのClipping・Maskingは統合される予定らしいので、将来は手軽に出来るようになるかもしれません。
本当に要素をぐにゅぐにゃ変形させていなくとも、...
1
票
Accepted
jqueryでの条件分岐について
こんな感じですか?
$(function() {
var $gallery = $("#gallery"),
$trash = $("#trash"),
$items = $("#items");
var numOfEachId = {};
$("li", $gallery).draggable({
cancel: "a.ui-icon"...
1
票
jqueryで要素別にカウントしたい
outを使うより、2つエリアを用意してその間を行き来するようにした方が制御が簡単な気がします(それぞれのdropで増減する)。
$(function() {
var $gallery = $('#gallery');
var $trash = $('#trash');
var $list = $('ul', $trash);
var $items = $('#...
1
票
monacaでフォームのダイアログを繰り返し出したい
一度フォームを入力してappendで新たにボタンを出すところまでは出来たのですが
このボタンをクリックで再度フォームを出すことができません。
ここの部分ついての回答としては、新たに追加したボタンにクリックイベントを設定していなかったのが原因だと思います。
また一度入力したフォームに関しては再度入力すると上書きされるようにしたいです。
こちらについては、
・何個めのボタンが押されたか
・...
1
票
1
票
localStorage.setItemで複数の値を保存したい
localStorageに1つのkeyで複数の値を保存する時はJSON.stringify()を使うと良いです。
また、取得時はJSON.parse()を使用します。
function set() {
var object = {
title: "Title",
value: "Value"
}
// JSON 文字列に変換して保存
localStorage....
1
票
Accepted
Ruby on Railsでjqueryのバージョンを2.xにしたい
jquery-rails gem の Installation のところにも書いてありますが、application.jsの
//= require jquery
を、
//= require jquery2
にしてください。
なお、jquery2 のバージョンは、Jquery::Rails::JQUERY_2_VERSIONで分かりますが、...
1
票
Accepted
ドロップされた要素を保存する
こんな感じですかね。
http://codepen.io/negibouze/full/mJVLqo/
$(function() {
// there's the gallery and the trash
var $gallery = $("#gallery"),
$trash = $("#trash"),
$items = $...
1
票
Accepted
ショッピングカートでのドラッグアンドドロップ操作
画像サイズとか表示枠とかいろいろ調整が必要ですが、
とりあえず画像を表示させるだけならこれでいけます。
変更前
function addBasket(basket, move) {
basket.find("ul").append('<li data-id="' + move.attr("data-id") + '">'
+ '<span ...
1
票
jQueryのプラグインのFullCalendarで一定の場合だけイベントが削除できない
success: function(ttevent,status){
event.color = ttevent.color;
event.id = ttevent.id;
$('#fullcalendar').fullCalendar('updateEvent', event);
$.ajax({
type: 'GET',
url: "...
1
票
javascriptでtextareaの中の高さを取得する方法
$('textarea').scrollTop() + $('textarea').innerHeight()
とかですかね・・・
1
票
javascriptでキャレットのように動かせる目印を作りたい
難しいのはinput[type="text"]に入力されている文字ごとの座標(や幅など)を取得することだと思いますが、とりあえず1文字ごとの座標や幅を取得できる汎用の関数として以下を定義できます。(Chromeでしか試していませんが。)
(function($) {
$.fn.mapForEachChar = function(callback) {
var $hidden = ...
1
票
jquery-uiのdraggableでドラッグした要素を取得する方法
console.lgoとのスペルのミス以外、コードは正しいです。下記のコードスニペットを実行して、ブラウザのコンソールで結果を確認できます。
$('.draggable').draggable({
stop: function () {
var t = $(this).text();
console.log(t);
}
});
<script ...
1
票
jqueryでソース上の並び替えをしたい
var target = $('div'); // 全てのdivが対象になるのでちゃんと指定する
var sorted_obj = target.sort(function(a,b){
return parseInt($(a).css('left')) - parseInt($(b).css('left'));
}));
target.parent().append(sorted_obj);...
Only top scored, non community-wiki answers of a minimum length are eligible
関連するタグ
jquery-ui × 38jquery × 31
javascript × 22
html × 5
ruby-on-rails × 3
monaca × 3
css × 2
jquery-mobile × 2
ruby × 1
node.js × 1
html5 × 1
wordpress × 1
socket.io × 1
fullcalendar × 1