0

プログラミング初心者です。
モーダルの画像にプラスマイナスのボタンをつけて拡大縮小したいです。
調べたところviewer.jsなどのプラグインを導入するとできそうなのですがやり方がわかりません。
教えていただける方いましたら
よろしくお願いいたします。
jquery3.3.1

[html]

<div>
<img class="img-thumbnail" src="ThumbnailUri" data-path="OriginalUri" data-toggle="modal" data-target="#image-modal" id="image-x-y" data-rotate="Lotate" style="cursor: pointer;"/>
</div>


<div class="modal fade" id="image-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
        <div class="modal-dialog modal-middle" id="modal-style">
           
            <div class="modal-content">
                <div class="modal-body">
                    <img src="" alt="" class="img-responsive center-block" id="modal-photo-box" />
                    <input type="hidden" name="org-width" id="org-width" value="" />
                    <input type="hidden" name="org-height" id="org-height" value="" />
                </div>
            </div>
        </div>
    </div>

[jquery]

$(".container").on('click', '#image-modal', function (event) { })
        .on('show.bs.modal', function (event) {
            var target = event.relatedTarget.id;

            var rotate = $('#' + target).attr('data-rotate');
            if (rotate === "0") {
                $("#modal-style").attr("style", "width:1000px;");
            } else {
                $("#modal-style").removeAttr("style");
            }

            var val = $('#' + target).attr('data-path');

            if (val === "") return false;

            $("#modal-photo-box").attr('src', val);

                     
        }).on('hidden.bs.modal.bs.modal', function (event) {
            $("#modal-photo-box").attr('src', "");
        });
2
  • フロントエンドだけの話であればC#.NETは関係ないのではないですか?なにかサーバサイドでやるべきことがありますか?
    – keitaro_so
    Commented 2021年1月27日 8:23
  • すいません、C#NETは関係ありません。サーバーサイドでやることはありません。
    – becchi
    Commented 2021年1月27日 8:32

0

この質問に回答するには、ログインする必要があります。

のタグが付いた他の質問を参照する。