I am building a mobile app for iPad using HTML, Javascript, CSS, and jQuery Mobile. I have popups with the black close (x) icons in the upper right hand corner of the popups. Everything works fine on desktop iPad simulator using safari browser. I click a button/link, and a popup fires, displaying the icon in the upper right hand corner. When I publish to my website, and view on my iPad, Safari browser, (1st generation), the close (x) icon disappears, the container for the icon is there, just no icon. I have checked, and all the files uploaded to my server correctly... anyone have any ideas here? thanks for any help!
Problem is with your server
Icon file gives Internal Server Error
Related
In the developer tools of chrome the mobile emulator shows only a fraction of the webpage in the top left corner but the rest of the page is blank.
One work around is if you select the mobile option dropdown on the center of the mobile emulated page you can select edit and enter your desired dimensions. When you choose the newly created option the screen looks fine.
As can be seen by box in red in image, you can adjust the resolution in the top of the menu.
I'm having the same issue it only shows the top left corner. That's for all webpages on mac version of chrome. I fixed the issue by going back to an older version.
Privew
I'm not an expert in web and I composed and updated my website recently. I ran all the test that I could on DreamWeaver CC and tested on multiple mobile devices (tablet, android and iphone); all seems to work fine. Until I uploaded the site to my server, the site start to act weird.
1st problem:
It is a portfolio website with individual pages to corresponding projects. On each project page, the first image on the lightbox has always gone missing; but clicking into the lightbox I can find the missing image (the preview image and the lightbox image share the same source so if the lightbox can find the image it implies that the image is on the server and the path is correct).
2nd problem:
when the browser is shrink below certain size, a toggle menu will replace the content on the header, clicking the toggle menu will show a pop up menu to site links. For some reason, after uploading the site to server, the toggle menu pop up never work.
3rd problem:
The above problem is never apparent on desktop browser(all image shows up correctly; toggle menu works). To make the problem more complicated, I can't confirm if it is device or browser oriented problem. For example, the site works on chrome browser on my iphone and nexus 5(android), but problem occurs on my xperia tablet(android) chrome browser; on my xperia tablet, the site works perfectly on firefox.
Does anybody has any idea what the potential cause to the problem, and perhaps a direction to a solution?
Here's the link to my site: http://www.itsatommy.com
Thank you for your time and look forward to any reply.
Looks fine to me (Google Chrome), you need to use media queries for some certain resolutions. You also need to use some cross browser css tags lide "-webkit, -moz, -o" etc.
I have a webpage that has a modal of an image. When I view the local version of the website the modal works fine, when I view it in IE, it works too, but normal chrome (private mode and normal). here are three images to show my problem.
I am asking, is this a browser bug or have I written some weird CSS somewhere.
The webpage is https://www.mickster04.com/mikesrail
How it looks normally (and should look for all)
Image cropped at the bottom when scrolled
local files when scrolled work too
I'm working on a hybrid app using Cordova, Bootstrap and Angular JS (1.3.x) and testing it in a Chrome desktop browser and on a Android device (lollipop, 5.0.2).
In a particular view, I open a modal window using ngDialog. The content in this dialog can exceed the height of a typical smartphone size, so vertical scrolling is required. And here comes the problem:
Most of the elements that should be displayed at the bottom of the dialog (out of initial sight) do not appear or don't getting rendered. When I blindly tap on the area where the disappeared interactive elements should be, they will get painted. When I then scroll up again, elements at the top disappear.
This behavior didn't exist on Android 4.4.
Now I'm able to reproduce this error on my Windows Chrome Browser (v43).
These are the steps:
Run this Plunkr http://embed.plnkr.co/VGYUe2i9vwsQZ21vc3LB/preview
Test with a recent Chrome Version
Make sure, this plunker is shown in embedded view (important)
Open Chrome developer tools
Click "Toggle device mode" (smartphone icon) (important)
Limit the vertical resolution to about 600px in height Click "open dialog" and scroll down to the bottom
Can you read "Hello, do you see me?" ?
If not, press on one of the panels on top or below the textbox, this
will cause a repaint and you can see the text.
This is how it looks:
Not OK -> No text in marked red boxes:
OK -> After clicks on it or browser tab switch
I found this article on postman blog, but the "fixer" does not seem to work in my case.
http://blog.getpostman.com/2015/01/23/ui-repaint-issue-on-chrome/
Can someone point me to the right direction?
I followed the instructions in the linked blogpost and those seem to work for me. Specifically, adding
-webkit-transform: translate3d(0,0,0);
to my CSS for ngDialog-content which has overflow-y: scroll.
Now the div scrolls on load for me.
The other good news is that at least my issue seems to be gone in Chrome Canary, so it may be worth seeing if the issue still exists for you there.
I recently updated my website to the latest version of Wordpress (3.1) and noticed a black bar at the top of the page when using Chrome. It's not present in Firefox or Internet Explorer 8, so I'm not sure what the issue is or where to look.
Screenshot of said issue.
See it live here.
that'll almost certainly be something to do with the admin bar - and, as such will be only visible if you're logged in.
Log in, then go to your profile and untick the admin bar on the front end and back end.
Then refresh in Chrome. Should be gone, then :)