ポップアップJqueryプラグイン「Magnific Popup」について

Magnific Popupを使ってpopupしたいのですが、
画像だけ表示などはできますが、
これを個数選択画面として使いたいです。
javascriptで動的に作った表で
項目｜数量
aaa ｜１　　変更
bbb ｜１　　変更
・
・
このような表が選択したものによって作られている状態だとします
数量は全て最初の初期値は１で、
変更ボタンを押すと横の項目と対応した数量を変更できるように
pupupさせてから個数選択画面を表示させたいです。※ページ遷移ではなくそのページで

これらを実現するためにjqueryとライブラリで作れないでしょうか？

調べてみるとMagnific Popupというものを使ってpopupはできるみたいなので、
これを応用してできないかと思っています。
難しいようでしたらjqueryMobileの導入や他のライブラリでも構いませんので、
サイトやライブラリだけでも教えて欲しいです。

例：ソーシャルゲームのアイテムの個数選択やオークションでの個数選択

再現方法は同じような仕様であれば大丈夫です。
よろしくお願い致します。

No.1 ベストアンサー 回答者： fujillin 回答日時： 2016/12/02 14:10

こんにちは

「Magnific Popup」は知りませんけれど、配布サイトの説明を見る限りではモーダルウィンドウを表示する機能があるようなので、それを利用すれば良いのではないでしょうか？
（似た機能を持つライブラリは、他にもたくさんあるとは思いますが・・・）
http://dimsemenov.com/plugins/magnific-popup/
（Examplesで右下にある例）

試していないので確かなことは言えませんが、表示内容は普通にHTMLで用意しておけば良いようですので、動的に作成することも可能と思われます。
（事前にラッパー要素だけを固定しておけば良いのではないかと推測）

ただし、「Magnific Popup」ではモーダル表示時に表示要素全体をbodyの先頭に移動させているようですので、表示中にイベントを取得したり、内容を変更したりといった処理を行いたい場合は、要素の位置や指定方法に注意が必要そうです。
また、表示中に内容を変更した場合に、表示後（モーダルを閉じた後）にも反映されたままになるのかなども確認する必要があるかも知れません。