css隐藏无图标图标

img.profile-picture{ 
     width:80px; 
     min-height: 80px; 
     float: left; 
     background-image: url("/images/user-4.png"); 
    }

上述CSS将用户配置文件图片背景设置为用户未上传自己的个人资料图片时的好位置。css隐藏无图标图标

在图像标记看起来像：

<img class="pull-left profile-picture" ng-src="{{profilePicturePath}}"/>

的问题是，当在设定的路径，我得到了丢失的图片图标没有图像：

似乎很洁癖在页面加载之前每次查询用户是否具有简档图片，并且为每个用户创建占位符图像是浪费服务器HDD空间。

是否可以隐藏无图像图标？

来源

2016-03-08 John

试图在js中做什么？ 'img.onerror = function（）{this.src ='/ images/user-4.png'}' – Adam

_“在页面前面每次查询用户是否有个人资料图片这是浪费服务器硬盘空间为每个用户创建一个占位符图像“_ - 您不为每个用户创建一个，您使用_one_占位符图像并输出该路径，如果用户没有个人资料图片集。这不是顶端，而是常识。即使您事先知道它不存在，让浏览器尝试加载图像 - 现在这将是无稽之谈。 – CBroe

好的，但我仍然需要以某种方式计算，如果用户有一个配置文件图片是服务器的工作。如果我可以将这个抵消到客户端，而不是显示破碎的图像的东西，那么这对性能更好。加上图像通过CSS下载。 – John

的onerror属性添加到img标签

<img src="brokenimage.jpg" onerror="this.style.display='none'">

为了保持无轮廓图片，我想包的图像与div，其中背景设置为no-profile.jpg图片

来源

2016-03-08 09:28:06 BeNdErR

新的一天新招。谢谢 – John

你可以试试：

<img ng-if="profilePicturePath" class="pull-left profile-picture" ng-src="{{profilePicturePath}}"/> 
<img ng-if="!profilePicturePath" class="pull-left profile-picture">

来源

2016-03-08 09:24:22 Yangguang

css隐藏无图标图标

回答

相关问题