www.mpee.fi
I made myself a website to study things and to put my content in. I ran in to an issue where several friends report that on an iPhone (7) the Photography section doesn't work. It just shows blank section. It is impossible for me to pin down exactly where the issue lies since I don't have any Apple devices at hand. Firefox emulator claims everything works fine, but in practice on iPhone 7 the Photography section fails to display.
I don't know if it is a Javascript problem, which would be odd since I use exact same method to display other sections (basic Ajax+PHP+JSON setup)
Or maybe it's a CSS problem where I am missing some CSS setting for Apple products?
I am so sorry for so vague question, but the problem is specific to iPhone (tested on 7). So while the question is board, the problem is specific.
I thank you in advantage for any possible aid. I want to fix this.
Related
I am currently working on a website that is still pretty simple.
You can click on ingredients and it shows you possible meals you could make with the selected ingredients.
While the site is working as intended on PC (tested on two different PCs), the page is loading infinitely on mobile (tested on android: chrome and firefox).
If I exclude my app.js file, the site is loading normally, so I guess the problem is somewhere in there.
The code is rather long (over 250 lines) so I don't know how I should upload it.
I googled my problem but found nothing so far, would be great if anybody could help.
If anyone has the same problem:
I was able to find the problem after some additional debugging.
There was a problem in the calculation of the element's locations in js.
If the width of my parent div falls below a specific value, the script is rounding down to 0 and is trying to divide by 0 in the next line.
I am still confused because usually js is responding with an error to division by 0, but at least it works now..
First a little context. I'm a designer from the Netherlands with a love for code. I can find my way pretty ok in html and css and a little bit in php and javascript. I love the Stack Overflow community, it helped me so much and it still helps me every day in becoming a little bit better at coding!
I have never asked a question here at S.O. before, because I always found a way to solve problems, untill now. I literally tried everything and I really hope you guys can help me.
I have a hobby project: https://unboxguide.com
It is some kind of TripAdvisor for CrossFit Boxes (gym boxes).
It is a Wordpress website which uses several different plugins for some functionalities.
The site works perfect on desktop browsers like Chrome, Safari, Firefox, etc. No problem there.
Then on mobile, still no problem there. On Android with chrome, it works perfect, on iPhone with Safari, still shiny.
But then.... the horror starts.
The Facebook in-app browser. There is something completely weird there. If I post a link to the website on Facebook and you click on it in the Facebook app it will open the Facebook in-app browser. The website renders completely randomly. Sometimes it doesn't load fonts, or any of the layout (css). Sometimes it doesn't even load the images.
Some research taught me that it is some kind of webview of the internal Mobile OS browser. So on iPhone a webview of Safari and Android a webview of Chrome.
I tested the Facebook links on Android, no problems there. The problem only occurs in the Facebook app on iPhone.
If you want to see for yourself, post https://unboxguide.com on your Facebook (just do it privately, so only you can see it) and keep refreshing it. The more you refresh, the more random results you will get. It's so strange.
I've tried so many things: rebuild the whole CSS, killed all plugins, tried different themes and tried to build everything from scratch. I also tried different backups from a few months ago where (I thought) the problem didn't occur yet. Nothing helped.
I really really hope someone has had the same issue or understands the problem, and can help or point me in the right direction.
Thanks in advance!
PS: If anything is needed furthermore to help you guys figure out what the problem can be, please let me know and I can post more information.
Old question, late answer. If your website uses ajax and uses X-Requested-With header to detect ajax requests (or not) this could be the reason. Webviews most of time use the X-Requested-With header for something else, so your pages are displayed like Ajax results (without css, javascript etc) and not like full html page.
Hope this helps.
Here's one that has perplexed designers for years now, even over the course of Twitter changes and countless hours of hair-pulling and blame-the-developer.
Twitter produces its own js widget for rendering a timeline. Here's a sample of the code without any customization, for an actual account - pasted as found in the interest of science rather than readability:
<a class="twitter-timeline" href="https://twitter.com/OT_Tweep/lists/ordinary-twitter" data-widget-id="570958838329643008">Tweets from https://twitter.com/OT_Tweep/lists/ordinary-twitter</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
I'm too noob here to include images directly. Here's a link to how it's supposed to look - and does in fact look on many browsers/machines - like Safari and, today but not yesterday!, Chrome - also on Firefox for mobile:
http://ordinary-gentlemen.com/wp-content/uploads/2015/02/correct_twitter_widget_display_safari.png
Here's how it renders on Firefox 36.0/Windows 7:
http://ordinary-gentlemen.com/wp-content/uploads/2015/02/twitter_widget_display_firefox.png
Not cool! But not a pure Firefox issue, nor a WordPress issue, and not a new issue. Literally as of a couple of days ago, the display on Chrome was, to use the technical term, kerflooey (embarrassingly worse than either of the above examples), as it had been for months. I don't recall having changed any setting on Chrome in the meantime, though I have used it a bit more than usual while investigating a different mystery (why an image appeared on my Chrome, but not someone else's, though on his iPad, but not his desktop, etc.).
There's a Twitter Developer Forum thread going back to 2012, continued for a at least a couple of years, never fully resolved, featuring one complaint after another. Some users seem to think they've solved the problem, others remain joyless. I'd link it, but I'm also over the newbie limit for links in a post. If anyone is interested, I'd be happy to post it in a thread.
I'm not sure I should hope that this question will put me over the 10 reputation hurdle, but I'd be very interested to learn if someone has a solution or explanation.
ADDENDUM: I should also note that a version of the widget displays fine on one WordPress site I'm using, but not another, through same browser/machine. Nor does disabling all Firefox add-ons and extensions produce desired rendering on the problem site. The thread I cannot post mentions the problems on Drupal and other sites, and a wide range of fixes, none of which fix.
If you want total control over the Twitter feed, you'd be better off to develop your own using the Twitter API and PHP.
https://github.com/J7mbo/twitter-api-php
The default js twitter widget is unreliable and obviously doesn't work on all browsers or devices.
What you need is the php twitter api to generate exactly the html that you want so you can have more control over the styling.
Let me know if you need help! I've developed a twitter module for Drupal.
After being out of the web development game for over a decade, I'm back and now rebuilding a school's site based on a Joomla template. Now on Chrome even a basic HTML tag won't bring up a link in the main template. All mailto links disappear (literally anything with an email address disappears from the text of the site) as well-- and was giving some random "install javascript" message.
This is the site. We had to do a bunch of CSS cutting and hacking to get the template to fit the visuals we needed.
http://www.novaschool.org/index.php/nova-home
If anyone has any ideas, I'm forever in your debt!!! Most of the teachers use Chrome, so we're never going to get far.
Cheers,
sam (who started web programming in '94, but hasn't done much of anything hands-on since '98)
There are a great many issues with this site. Critically, it really needs to be updated to a current,secure, version of Joomla.
The issues you are referring to though are because 1) your links are white in colour and the background is white, rendering them invisible and 2) the menu is set to be 90% of the width of the body and uses absolute positioning, making it impossible to interact with any element beneath it.
Honestly, if I were you I'd start with a fresh current installation of Joomla and copy your content across, it will be far less work than bringing this one up to scratch.
p.s. For future reference, there's a Joomla specific Stack Exchange.
I am trying to achieve a Digital Signage using Raspbian OS on my Raspberry. I set my r-pi to open in kiosk mode chromium browser and to shows a slideshow od ads and scrolling news within my web application.
I created the ads slideshow using jquery image slideshow and scrolling news with marquee html tag.
The result is jerkily scrolling news.
I think the problem is due to the couple "jquery-marquee" because if I run only jquery or only marquee it works!
Can you give me some ideas?
I thought to only use CSS3 to realize scrolling news and scrolling ads
UPDATE: You can see my work here
From normal browser it works. From chromium v.22 on raspbian-raspberry it is a disaster.
I have already choosen little images (not bigegr than 200kb) but the problem remains.
I utilised jquery image slideshow and jquery.marquee
I hope you can help me to solve this issue.
I just read a bit from http://blogs.wcode.org/2013/09/howto-boot-your-raspberry-pi-into-a-fullscreen-browser-kiosk/ and noticed:
Optional bonus Step 4: Accelerated X11 Server
Currently (Sep 2013), the default X11 server isn’t exactly optimised
for the Raspberry Pi; however, work is afoot and you can install a
work-in-progress version fairly easily. This has worked for us and has
been nice and stable. YMMV.
UPDATE: Comments have suggested possible problems with newer Rasbian
releases. We’ve not verified this either way. You don’t need to
install this, everything will work just fine without it; at the time,
we were trying to squeeze every last ounce of performance from the Pi,
so it seemed pertinent to install this patch.
The blog mentions an accellerated X11 server
https://github.com/simonjhall/fbdev_exa/ , or in particular
https://github.com/simonjhall/fbdev_exa/tree/master/releases/20130401
Maybe following the instructions on that blog link might help.