jQuery技术:当background-size设置为包含时,如何获取背景图像的尺寸?

HTML:

some text

CSS:

 .logo-container { display: block; background: url(img/logo.png) no-repeat center; background-size: contain; width:100%; height:20%; } 

如何获得背景图像缩放到的当前尺寸?

我假设背景图像尺寸与.logo-container尺寸不同。

    小提琴: http : //jsfiddle.net/umXk3/

    由于您已经知道图像是780x150缩放格式的780x150 ,因此您可以从.logo-container的尺寸中推断出其当前尺寸:

     var width = $('.logo-container').width(); var height = $('.logo-container').height(); // Calculate dimensions depending on if width is greater than height: var imgWidth = width > height ? 780/150 * height : width; var imgHeight = height > width ? 150/780 * width : height; 

    试试吧

     var wdth = $('.logo-container img').width(); var hght = $('.logo-container img').height(); 

    或者你也可以得到div的高度和宽度

     var wdth = $('.logo-container').width(); 

    因为图像是该div的背景图像。

    需要了解更多jQuery教程分享当background-size设置为包含时,如何获取背景图像的尺寸?,都可以关注jQuery技术分享栏目—计算机技术网(www.ctvol.com)!

      以上就是jQuery教程分享当background-size设置为包含时,如何获取背景图像的尺寸?相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/981617.html

      (0)
      上一篇 2021年12月12日
      下一篇 2021年12月12日

      精彩推荐