Jquery 元素'；s的宽度每单击一次都会更改

我试图得到图像的宽度，然后使div的宽度相同

HTML

---

在此之后，我得到了图像的宽度，但每次点击它都会将宽度减少10%。我的代码有什么问题吗？

你也可以发布相关的HTML吗？@TasosK。在这里，我为您的应用程序添加了HTML totry width

auto

modal@PawanNogariya我已经完成了width:auto，但它将引导模式的默认宽度修改为568px，我想根据大的宽度动态添加宽度image@QararUlHassanCSS方法是否适合您？

<!-- Thumbnail -->
<div class="work-img">
    <img data-toggle="modal" data-target="#myModal" target="15" src="images/15.jpg" class="img-responsive" alt="">
</div>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <img src="" />
            </div>
        </div>
    </div>
</div>

$('.work-img img').click(function(){  // On thumbnail click
    $('.modal-body').find('img').attr({ // Find image tag and add attribute 
        src: "images/" + $(this).attr('target')+ "-1.jpg" // Add large image source according to image dynamically
    });
});
// Now the large image will be shown in the modal and I want to give the modal-dialog a width according to image width. For that I use this.
$("#myModal").on("shown.bs.modal", function () { // On modal show
    $('.modal-dialog').css({ // Add width using css to .modal-dialog
        width: $(this).find('.modal-body').find('img').width(), // Get the width of image, that was loaded dynamically
        'max-width': '80%' // max-width of the modal will be 80% of the screen
    });
    $('.modal-body').find('img').css('max-width', '100%'); // Add 100% width to loaded image so it remains in the modal-body
});