Drag and Drop jQuery Plugin Reorder ExampleDrag the items below to change their order Item A Item B Item C Item D Item E
1stWebDesigner • Helping You Build a Better Web - For Web Professionals
Learn Web Design Retro CSS Text Effect: A Step-by-Step TutorialCSS offers an array of tools that, when used correctly, can improve the visual experience on your website. In this tutorial, we’ll explore a straightforward way to design a retro text effect with pure CSS. The approach, while not overly complex, yields a visually appealing result and serves as a… UX surveys can be pivotal tools for des
jquery順番入れ替え
I’ve been using JQuery for a while now and really agree with its tag line that it’s the “The Write Less, Do More, JavaScript Library”. We’ve also got this code for dragging and dropping table rows that has proved very popular, so it seemed natural to combine the two and wrap up the table drag and drop as a JQuery plugin. Update: You can now read the latest docs at https://github.com/isocra/TableDn
jQueryを使ってのドラッグ＆ドロップUIをiPhoneやAndroidでも簡単に動作するようにしてくれるプラグイン「jQuery UI Touch Punch」｜BLACKFLAG
先日ここでも紹介したjQueryを使ってのドラッグ＆ドロップUI。 通常jQueryでドラッグ＆ドロップを実装するには「jquery-ui.js」を使って 「.draggable()」「.droppable()」といったアクションを使って操作しますが これらはiPhoneやAndroidには対応していません。 そこで、これらの「.draggable()」「.droppable()」ドラッグ操作を 簡単にiPhoneやAndroid対応にしてくれるプラグイン「jQuery UI Touch Punch」が かなり使えそうだったので自分用メモ書きとして紹介してみます。 jQuery UI Touch Punch – Touch Event Support for jQuery UI jQuery UI Touch Punch – Touch Event Support for jQuery U
ドラッグで並べ替え可能なグリッドを実現する「draggable_grid.js」を作りました - WebOS Goodies
WebOS Goodies へようこそ！ WebOS はインターネットの未来形。あらゆる Web サイトが繋がり、共有し、協力して創り上げる、ひとつの巨大な情報システムです。そこでは、あらゆる情報がネットワーク上に蓄積され、我々はいつでも、どこからでも、多彩なデバイスを使ってそれらにアクセスできます。 WebOS Goodies は、さまざまな情報提供やツール開発を通して、そんな世界の実現に少しでも貢献するべく活動していきます。 本日は、久しぶりに JavaScript のライブラリを公開します。よく、画像ギャラリー等でマウスのドラッグ＆ドロップで画像の並べ替えができるものがありますが、そんな UI を簡単に実現できるものを作ってみました。以前に公開してご好評をいただいた DragResize.js のノウハウを引き継いでおり、以下の特徴があります。 JavaScript の呼び出しひとつ
手軽にタップやスワイプ等のジェスチャーイベントを実装できる「QUOjs」 | MJ-WAVE.COM
今回はスマホのジェスチャーイベントを手軽に実装するQUOjsを軽く触ってみたので、簡単な使用方法を書きます。 詳しい仕様方法は公式サイトに書いてありますが、基本的な部分はjQueryと同じなのでジェスチャイベントの部分だけ紹介します。 基本的な形 $$('.selector').touch(function(){}); って感じで書きます。jQueryとコンフリクトしないように「$$」を使うような仕様になってます。 現在使えるジェスチャイベントは以下の図のものとなっています。 実際に使用する際のコードを一気に羅列します。 $(function(){ $$('.quo_touch').touch(function(){ alert('TOUCH'); }); $$('.quo_tap').tap(function(){ alert('TAP'); }); $$('.quo_hold').ho
ドラッグ＆ドロップで並べ替えるときのドラッグできる部分を指定
jQuery UI の Sortable プラグインの handle オプションを使うと、ドラッグ＆ドロップで並べ替えるときの、ドラッグできる部分を指定できる。 項目のボックスを並べ替えたいが、ドラッグできるのはボックス内の一部だけにしたい…そんなときに、役立つオプションだ。 実装例（サンプル） 項目 1 項目 2 項目 3 項目 4 項目 5 項目 6 項目 7 実装例の動作について 「項目 1」のボックス内の右端にある にカーソルを合わせると、カーソルの形状が移動用カーソル形状になる。「項目 1」の を、ドラッグして、下へ動かし、「項目 2」の上に持ってくると、「項目 2」が上へ移動し、「項目 2」と「項目 3」の間にスペースができる。そのスペースへドロップすると、「項目 1」と「項目 2」が入れ替わり、「項目 2」「項目 1」「項目 3」…の順番になる。 同様に、「項目 1」から「項
[jQueryUI入門] ドラッグ&ドロップの使い方
Drag&Dropは、jQueryUIのサポート機能を使って実装します。dropは単体では使いません。drag機能と組み合わせて使用します。指定したブロック要素(ドラッグアイテム)を特定のエリアへドラッグした際、何かイベントを発生させたり計算したりする際に使います。 javascriptファイルのロード 「jquery.js」「jquery.ui.core.js」と「jquery.ui.widget.js」「jquery.ui.mouse.js」の4つが必須です。jQueryUIの1.8以降は、draggableファイルとdroppableファイルが分かれているので、Draggable機能を使う場合は「jquery.ui.draggable.js」、Droppable機能を使う場合は「jquery.ui.droppable.js」もロードします。Drag&Dropの機能はほとんどがjava
![[jQueryUI入門] ドラッグ&ドロップの使い方](https://cdn-ak-scissors.b.st-hatena.com/image/square/d91b374af30a5b46e04a8744f55e74edc2bf7025/height=288;version=1;width=512/http%3A%2F%2Fblog.diimo.net%2Ffiles%2Fasset%2F25%2Fpt.png)
unbind([type], [data]) - jQuery 日本語リファレンス
bind関数とは反対に、各要素のイベントに関連付けられた関数を削除します。 引数を全て省略した場合、全ての要素から全イベントが削除されます。 第一引数にイベント名が指定された場合、そのイベントに関連付けられた関数だけが削除されます。 第二引数に関数ポインタを渡した場合、指定イベントに結び付けられた、指定の関数のみが削除されます。 bindしたカスタムイベントを削除することも可能です。 “theone”というボタンは、最初はクリックしても何も起こりません。 “bind”をクリックすると、”theone”のクリックにaClick関数をひもづけて、クリックされたことが表示されるようにします。 “unbind”をクリックすると、このaClick関数がunbindされ、クリックしても何も起きない状態に戻ります。 <button id="theone">Does nothing...</button>
Brrr とりあえず完成版 - jsdo.it - Share JavaScript, HTML5 and CSS
iPhoneのホーム画面風並び替えです。 ・アイコンを長押しすると並び替えモード（アイコンが震える）になります ・並び替えモード時には各アイコンをドラッグ&ドロップで移動できます ・並び替えモードを抜けるにはダブルクリック（タップ）します jQuery UIや公開されているjQueryプラグインの組み合わせのみで動いてると言っても過言じゃない感じです。 ・ダブルタップ http://blog.webcreativepark.net/2010/09/08-204058.html ・jQuey UIをtouchイベントでも使えるように https://github.com/furf/jquery-ui-touch-punch アイコンは各社のfavicon.icoを勝手に利用させていただきました。 ※ アイコンの選択に意味はありません 本当はやりたかったこと ・並び替えモードにするときに押して
monoweb.info
monoweb.info Buy this domain. 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
msto.jp - it転職 リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
iphoneアプリ開発日記その9 - はりまや日記
webview のリンク長押しをなんとかする 一日目 やりたいこと リンク長押しを検知して、リンクのURLとタイトルを取得したい ということでやってみる native からアプローチ とりあえず長押しのジェスチャーを仕込めばいいのではないか。 そういう風に考えていた時期がありました。 とりあえずやってみる ここを参考に、以下のコードを追加 - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selec
スタイルの内容を取得する際、display = 'none' の状態だと内容が取得できない - Enjoy*Study
下記のようなスタイルがあったとして、 #hoge { width: 100px; position: fixed; } hogeに適用されているスタイル(例えばposition)を取得したい場合、hogeのスタイルに display = 'none' が設定されていると、Safariでは内容が取得出来ないようです。 var element = document.getElementById('hoge'); var css = document.defaultView.getComputedStyle(element, null); alert(css.getPropertyValue('position')); // fixed element.style.display = 'none'; alert(css.getPropertyValue('position')); // 取れない
iPhone、iPadでのoverflow:scroll/autoの動作について - SUSH-i LOG
ある案件で、divタグにoverflow:autoを指定し、スクロールバーを表示される様な指定をしていたのですが、iPadで確認を取った時に、スクロールバーが表示されていない事を教えてもらい、iPhoneでも同様の状態になっている事に気づきました。 また、通常のスクロールのようになぞってもスクロールされず、中のコンテンツを確認することが出来ませんでした。 何か方法でもあるのかと調べてみたところ、「メモ: iPad（iPhone）の困った仕様」で、「二本指」でなぞることでスクロールする事が分かりました。 説明書が無い、また、二本指でのスクロールはあまり使わないことから、中々気づきにくい操作であるような気がするので、iPhone向けのコンテンツなら尚更、ページ内に説明文が必要な感じを受けました。 「直感的」な操作であるタッチパネルであっても、今回であればページ内の一部のコンテンツをスクロールさ
Skroll
Photo by Martin Gommel "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque
2.0 api documentation
$('.container').shapeshift # The Basics selector: "*" # Features enableDrag: true enableCrossDrop: true enableResize: true enableTrash: false # Grid Properties align: "center" colWidth: null columns: null minColumns: 1 autoHeight: true maxHeight: null minHeight: 100 gutterX: 10 gutterY: 10 paddingX: 10 paddingY: 10 # Animation animated: true animateOnInit: false animationSpeed: 225 animationThresh
アンドロイド用画像保存禁止
画像保存禁止(Android) (control Contextmenu(Android)) ▼『head』用のコード <script type="text/javascript"><!-- addEventListener('touchstart', function(e) { if(.e.target.tagName == 'IMG') e.preventDefault(); }, false); // --></script> by JavaScript Note
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Puzzle
Azoffdesign - Situs Berita Terpercaya -