Javascript-форум - Подставлять title картинки в зависимости от ее размера

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Подставлять title картинки в зависимости от ее размера (https://javascript.ru/forum/dom-window/80553-podstavlyat-title-kartinki-v-zavisimosti-ot-ee-razmera.html)

Подставлять title картинки в зависимости от ее размера

Здравствуйте. Есть такой скрипт:

$(document).ready(function() {
    var $newsImg = $(".story img");
    $newsImg.one("load", function() {
        $(this).after(function() {
            var imgTitle = this.title;
            if (imgTitle && imgTitle != '' && $(this).width() > 200 && $(this).css('float') == 'none')
            return "<span class='img_title'>" + imgTitle + "</span>";
        });
    }).each(function() {
        if (this.complete)
            $(this).trigger("load");
    });
});

<style>
img, span.img_title {display:block;}
</style>

<div class="story">
<img src="https://belnaviny.by/wp-content/uploads/2018/12/belnaviny.by-v-belarusi-dorozhaet-gorodskaya-telefonnaya-svyaz-i-pochtovye-otpravleniya-300x150.jpg" alt="Подсказка альт" title="Подсказка тайтл">
</div>

С помощью этого скрипта я вывожу title картинки отдельно span-ом. Вывод зависит от того, какого размера картинка показывается на экране. А возможно ли как-то изменить скрипт и сделать вывод title в зависимости именно от фактического размера самой картинки? Т.е., если физическая ширина картинки, скажем, 200px или больше, то только в этом случае title выводить.
Спасибо!

Цитата:

Сообщение от LADYX

в зависимости именно от фактического размера самой картинки?

:-?

Цитата:

Сообщение от LADYX

$(this).width() > 200

this.naturalWidth > 200

Точно)) А я указывал так:

$(this).naturalWidth() > 200

Но почему-то так не работает. Рони, спасибо-спасибо!! :)

Цитата:

Сообщение от LADYX

Но почему-то так не работает.

Цитата:

Сообщение от LADYX

&& $(this).css('float') == 'none'

это зачем?

Цитата:

Сообщение от рони

это зачем?

Рони, это можно убрать и прописать в стиле?

LADYX,

<!doctype html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
span.img_title{
   color: red;
}
.story img{
    width: 200px;
}
.story{
    margin: 8px;
}

</style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script>
$(function() {
    var $newsImg = $(".story img");
    $newsImg.one("load", function() {
        $(this).after(function() {
            var imgTitle = this.title;
            if (imgTitle  && this.naturalWidth > 200 ) return "<span class='img_title'>" + imgTitle + "</span>";

        });
    }).each(function() {
        if (this.complete)
            $(this).trigger("load");
    });
});

  </script>

</head>
<body>

<div class="story">
<img src="https://picsum.photos/300/100?1" alt="Подсказка альт" title="Подсказка тайтл 300">
</div>
<div class="story">
<img src="https://picsum.photos/200/100?1" alt="Подсказка альт" title="Подсказка тайтл 200">
</div>
<div class="story">
<img src="https://picsum.photos/400/100?1" alt="Подсказка альт" title="Подсказка тайтл 400">
</div>
</body>
</html>

Рони, огромнейшее спасибо!!! Успехов вам! И удачных выходных!