Showing posts with label html5. Show all posts
Showing posts with label html5. Show all posts

Thursday, May 21, 2015

More videos with Crombz!

Recently, I've updated the source code of Crombz.com to be more flexible.  This was in the intention of creating sub-sites dedicated at different categories of videos.
With the main site, Crombz.com, two new sites have been put online:

Minecraft.crombz.com: You guess it, videos about your favorite game.
Bestfails.crombz.com: Discovering the best fails videos on YouTube.


The idea is to test my code to validate its flexibility a scalability for other purpose.  I'm not trying to replace YouTube but it's fun to interact with a major data source and use HTML5 and CSS to create a new kind of interface in pure web.  It's not an easy task but I can handle it while enjoying the challenge of making something new and fresh.


If you haven't had a look at my website, go check it out and please, share with your friends.

Sunday, March 29, 2015

Webapp for iOS: How to avoid links opening in Safari

If you're a web developer, you may have found out that any website can be added to the home screen of any iOS devices.

It's a feature that is builtin iOS and with the proper meta-tags in your HTML code, you can create a webapp for iPhones and iPads quite easily.

The main issue is when your webpage has links.  The default behaviour in iOS is to open Safari to view the link, meaning that your webapp will open in Safari as soon as the user clicks a link in your webpage.  This is annoying as you may want the link to open inside the webapp and not in Safari.

Do not despair, there is a simply trick that you can use with Javascript to avoid this issue.  Nothing fancy and nothing complicated.  Just a simple line of Javascript will solve this problem...

Here's a common link in a webpage:

<a href="viewer.php">View this link</a>
The problem is that as the user will click this link on his iPhone, Safari will popup to display the content of the link instead displaying the "viewer.php" from inside the webapp.  Instead, create your links as such:
<div onclick="document.location='viewer.php';">View this link</div>
This will load the new webpage and stay inside the webapp instead of opening in Safari.  As a bonus, the "onclick" event is available on almost all elements, meaning that you can transform any element into a clickable link.

The, you just have to use CSS to set the proper look on the element to it looks like it is a link and behaves like a link...

Have fun!