【问题标题】:Angular: Dynamically changing image (portrait/landscape) using media queries?Angular:使用媒体查询动态更改图像(纵向/横向)?
【发布时间】:2019-10-13 19:04:12
【问题描述】:

我正在尝试根据设备是纵向还是横向来更改图像。通常这样做我会使用媒体查询,但我需要替换的 2 个图像是动态的并存储在配置文件中。

我想知道是否可以使用 Angular 插入媒体查询并根据方向动态更改图像?

我也在使用 SASS,但我仍然看不到通过代码执行此操作的方法。

【问题讨论】:

    标签: javascript css angularjs sass media-queries


    【解决方案1】:

    听起来你应该使用图片元素:

    https://developer.mozilla.org/en/docs/Web/HTML/Element/picture

    如果您支持旧版浏览器,请查看图片填充:

    https://github.com/scottjehl/picturefill

    【讨论】:

    • 那很酷 :-) 我还想知道您是否知道任何针对 Angular 的媒体查询服务。 $mdMedia 存在于 Angular Material Design 中,但我不想将其全部添加到我的网站中只是为了使用,这似乎是一个非常好的 Angular 服务。
    • 另外,用于图片填充的 polyfil 看起来真的很酷,但我有点担心有关 android 2.3 / safari 浏览器的问题。修复一个似乎会导致另一个问题
    • 您是否尝试过将 $mdMedia 工厂插入到您的项目中? github.com/angular/material/blob/v1.0.9/src/core/util/media.js
    • 查看工厂,您还需要包含 $mdConstant。
    猜你喜欢
    • 2013-04-07
    • 1970-01-01
    • 2012-12-04
    • 2013-08-27
    • 1970-01-01
    • 2015-08-17
    • 1970-01-01
    • 2015-01-07
    • 2013-06-30
    相关资源
    最近更新 更多