javascript PrettyPhoto 移动响应
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23931523/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-10-28 01:50:09 来源:igfitidea点击:
PrettyPhoto mobile responsive
提问by
Is there any way I can make PrettyPhoto responsive for mobile phones and tablets? I tried but it seems to be too hard for me. Any idea is welcomed Thanks
有什么方法可以让 PrettyPhoto 对手机和平板电脑做出响应？我试过了，但对我来说似乎太难了。欢迎任何想法谢谢
采纳答案by Daniel Patilea
I've got a similar problem recently. Try those css rules:
我最近遇到了类似的问题。试试这些 css 规则：
.pp_pic_holder.pp_default { width: 100%!important; left: 0!important; overflow: hidden; }
div.pp_default .pp_content_container .pp_left { padding-left: 0!important; }
div.pp_default .pp_content_container .pp_right { padding-right: 0!important; }
.pp_content { width: 100%!important; height: auto!important; }
.pp_fade { width: 100%!important; height: 100%!important; }
a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none!important; }
#pp_full_res img { width: 100%!important; height: auto!important; }
.pp_details { width: 100%!important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px!important; }
a.pp_close { right: 7%!important; top: 10px!important; }
You apply it to mobile phones and tablets using this:
您可以使用以下方法将其应用于手机和平板电脑：
@media only screen and (min-width: 600px) and (max-width: 1024px) { /* css rules */ }
