Tag: css

当地址栏被隐藏/显示时,内容在Chrome iOS上垂直跳转,并具有视口大小

我在我的网站上有不同的部分,我希望他们中的一些人能够看到整个视口的高度。 所以我的height: 100vh; 在Chrome iOS上,当地址栏被隐藏或再次显示时,这会导致内容略微“垂直跳跃”。 尤其是,每当用户在一个方向上滚动然后在另一个方向上滚动时就会发生这种情况 你可以在这里看到一个例子(看看Chrome手机浏览器): www.PlasticPalacePeople.com 任何想法如何解决? (理想情况下,让我的部分采用全视angular高度) PS:Safari的iOS和embedded式Facebook网页浏览器似乎没有问题 谢谢

使用从URLvariables读取的JavaScript加载不同的CSS样式表

我试图在我的WordPress博客上有两个不同的样式表,以便在通过网页访问页面时使用一个样式表,而在通过iOS应用程序访问博客内容时使用另一个样式表。 现在,我们正在追加?app = true从我们的iOS应用程序的URL请求,希望在我们的博客,我们可以search这个string,并加载不同的样式表。 我们正在使用JSON API插件,以便我们的iOS应用程序可以以编程方式拉我们的博客文章,并在iOS应用程序的Web视图中显示它们。 在我的wordpress博客中,我使用的是在URL中查找?app = true的JavaScript,如果是,请加载不同的样式表。 <script language="javascript" type="text/javascript"> var currentLocation = window.location.href; if(currentLocation.indexOf('/?app=true') > -1) { document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"appstyle.css\" />"); } </script> 你可以看一下http://blog.meetcody.com并查看页面源代码。 你会看到这个代码片段之间的标签。 我遇到的问题是上面的代码实际上并没有加载appstyle.css样式表。 如果你看看http://blog.meetcody.com/wp-content/themes/standard/appstyle.css?ver=3.4.2你可以看到我正在testing这个设置背景:黑色body {}标记 body { background: black; } 而在style.css中http://blog.meetcody.com/wp-content/themes/standard/style.css?ver=3.4.2身体背景色是#F2F0EB; 在body {}标记中 body { background: #F2F0EB; } 我怎样才能传递一个URLvariables,如?app = true,当传递,我加载一个不同的样式表?

iOS中的textarea上的Shadow DOM强制填充

我遇到一个使我困惑的问题。 我对这个问题的参考是Mac上的Chrome 32和iOS 7.0.4上的Safari。 在以下示例中,Chrome将.background和textarea元素中的文本呈现完美并相互.background ,这就是我想要的。 iOS上的Safari,用3个像素单位来抵消textarea中的textarea 。 虽然填充,边框和边距在这两个元素上都设置为相同的值,但发生这种情况。 当我在Safari的开发者工具中进行debugging时,无论是通过我的iPhone设备还是iOS模拟器,在概述元素指标时,元素本身都是完美alignment的。 标记 <div class="container"> <div class="background">This is a test</div> <textarea>This is a test</textarea> </div> CSS .container { border: 1px solid #cdcdcd; background: #f0f0f0; width: 400px; height: 50px; position: relative; margin: 24px 0; } .background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; color: […]

使用不受支持的WebKit属性的含义是什么?

我有兴趣在混合iOS应用中使用-webkit-line-clamp 。 我已阅读不受支持的属性上的苹果文档 。 使用不受支持的属性是否明智?或者我冒着在移动Safari浏览器和其他浏览器实现中的webkit的未来实现中删除该function的风险? 如何检查WebKit属性的状态?

iOS Chrome / Safari – 在模态内对焦input时不需要的滚动

testingSafari和Chrome – 结果相同,所以我认为这是iOS的问题。 只有在模态内有input时才会发生这种情况,我点击该input。 在同一时刻,该input获得焦点和本地iOS键盘变得可见。 同一时刻模态下的页面会自动滚动到其高度的50%。 这种行为是完全不需要的,我不知道如何防止这种默认的iOS“function”。 演示: 更新 :修复提交: limonte / sweetalert2 /提交/ 4a2d36b

angularjs幻灯片过渡破坏在safari ios 9

我有以下的CSS类,我用来滑动我的ng-view在路由更改开始左和右。 这些都在大多数浏览器,手机等相当好的工作,直到现在…在ios 9下animation不工作,它不再滑动从左到右,但视图从小尺寸滑动到全尺寸,效果相当不愉快。 任何帮助将受到欢迎! CSS .slide-left.ng-enter, .slide-left.ng-leave, .slide-right.ng-enter, .slide-right.ng-leave { position: absolute; top: 58px; right: 0; bottom: 0; left: 0; background: inherit; -ms-transition: 0.35s ease-in-out; -webkit-transition: 0.35s ease-in-out; -moz-transition: 0.35s ease-in-out; -o-transition: 0.35s ease-in-out; transition: 0.35s ease-in-out; } .slide-left.ng-enter { z-index: 101; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); -moz-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } .slide-left.ng-enter.ng-enter-active { […]

WKWebView无法加载图像和CSS使用loadHTMLString(_,baseURL :)

苹果推荐 : 在iOS 8及更高版本中运行的应用程序中,使用WKWebView类而不是使用UIWebView。 因此,我用一个shiny的新WKWebView取代了我的旧UIWebView 。 但是,我认为是一个简单的练习(简单地交换类和replace委托方法)竟然是一个混乱。 问题 当我加载一个HTMLstring使用 loadHTMLString(String, baseURL: URL?) Web视图加载并呈现纯HTML,但不加载任何在htmlString引用的图像或CSS文件 。 这只发生在一个真实的设备上 ! 在Simultor中,所有引用的资源都被正确加载。 例 我在我的视图控制器类中定义了一个简单的htmlString : let imageName = "image.png" let libraryURL: URL // The default Library URL var htmlString: String { return "<html> … <img src=\"\(imageName)\" /> … </html>" // "…" represents more valid HTML code incl. header and body […]

如何在无响应的移动网站上设置视口?

我正在devise一个无响应的网站,并在移动视图中遇到问题。 我没有设置视口。 我认为内容应该在桌面上显示相同,因为它只在桌面上缩小。 这是我的问题的视觉: 说明: 在桌面上查看时很好。 在iPhone(手机)标题,导航和页脚的宽度收缩(见图片),主要内容本质上超出了电话viewframe(或视口或其他)… 谢谢!

UIWebView和CSS的固定位置

我有一个使用固定位置标题的UIWebView 。 当包含UIWebView的ViewController是初始视图时,固定位置div没有问题。 当我通过模态显示同一个ViewController时,这就是问题的发生时间。 第一次在页面上滚动时,div移动并且滚动页面,但是一旦我第一次放开滚动,div就返回到它的固定位置,错误再也不会发生了。 有任何想法吗? 我已经看到iScroll ,它iScroll我想要的页面一样工作,我认为有一个更简单的方法,因为我只得到在UIWebView的初始加载的问题…

只有在分配事件监听器的情况下,CSShover在ios上才有效

我正面临一个奇怪的问题。 我已经创build了一个CSS下拉菜单中的select使用js下拉表单元素。 它似乎在大多数的浏览器,但ios设备工作正常。 当我将鼠标hover在下拉菜单上时 csshover事件不是在ios设备中触发的,但是如果我添加一个eventlistener到下拉元素而在监听器中没有动作,hover事件开始工作。 这是我的代码来编辑: http : //codepen.io/kuldeepdaftary/pen/jKeDi testing: http : //codepen.io/kuldeepdaftary/full/jKeDi 尝试JS中的以下片段的评论: $('.dropdown').click(function(){}); 一旦你评论上述部分! Csshover将不再在iPhone / iPad的工作,但只要你取消注释,它将正常工作。 由于clickevent列表function是空白的! 我不明白这是什么解决问题?