<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<h3>parent 1 </h3>
<div my-directive parent="parent" index="0"></div>
<div my-directive parent="parent" index="1"></div>
<h3>parent 2 </h3>
<div my-directive parent="parent2" index="0"></div>
<div my-directive parent="parent2" index="1"></div>
</div>
感谢您的支持,使此代码具有响应性,以便弹出窗口可以在移动设备上查看。
答案 0 :(得分:0)
我认为最简单的方法是编写media-query
并缩小#popup
的宽度以缩小屏幕。
@media only screen and (max-width: 600px) {
#popup{
width: 300px !important;
}
}
如果你可以控制html元素,请避免编写内联样式并将宽度设置为百分比值,这样就不需要编写媒体查询。
此外,仅供参考,如果您不需要支持旧版浏览器,则可以使用transform:translateX(-50%);
使#popup
水平居中对齐,而不是使用负边距。
希望这会有所帮助。让我知道。