Skip to content

Instantly share code, notes, and snippets.

@H1D
Created September 21, 2012 23:33
Show Gist options
  • Save H1D/3764514 to your computer and use it in GitHub Desktop.
Save H1D/3764514 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
<link rel="stylesheet" href="iui.css" type="text/css" />
<link rel="stylesheet" href="t/default/default-theme.css" type="text/css"/>
<script type="application/x-javascript" src="iui.js"></script>
<style type="text/css">
div {
position: relative;
}
.c1 .button,
.c1 .whiteButton,
.c1 .grayButton,
.c1 .redButton{
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.c2 .button,
.c2 .whiteButton,
.c2 .grayButton,
.c2 .redButton{
-webkit-user-select: none;
}
.both .button,
.both .whiteButton,
.both .grayButton,
.both .redButton{
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select: none;
}
</style>
</head>
<body>
<div class="toolbar">
<h1 id="pageTitle"></h1>
<a id="backButton" class="button" href="#"></a>
</div>
<ul id="screen1" title="Main" selected="true">
<li><a href="#clean">No changes</a></li>
<li><a href="#c1">With "-webkit-tap-highlight-color: rgba(0,0,0,0);"</a></li>
<li><a href="#c2">With "-webkit-user-select: none;"</a></li>
<li><a href="#both">With both</a></li>
</ul>
<div id="clean" title="Clean">
<a class="whiteButton" href="javascript:void(0);">whiteButton</a>
<a class="grayButton" href="javascript:void(0);">grayButton</a>
<a class="redButton" href="javascript:void(0);">redButton</a>
<a href="javascript:void(0);">just link</a>
<div>
<a class="button" href="javascript:void(0);">small button</a>
</div>
</div>
<div id="c1" title="-webkit-tap-highlight-color" class="c1">
<a class="whiteButton" href="javascript:void(0);">whiteButton</a>
<a class="grayButton" href="javascript:void(0);">grayButton</a>
<a class="redButton" href="javascript:void(0);">redButton</a>
<a href="javascript:void(0);">just link</a>
<div>
<a class="button" href="javascript:void(0);">small button</a>
</div>
</div>
<div id="c2" title="-webkit-user-select" class="c2">
<a class="whiteButton" href="javascript:void(0);">whiteButton</a>
<a class="grayButton" href="javascript:void(0);">grayButton</a>
<a class="redButton" href="javascript:void(0);">redButton</a>
<a href="javascript:void(0);">just link</a>
<div>
<a class="button" href="javascript:void(0);">small button</a>
</div>
</div>
<div id="both" title="Both" class="both">
<a class="whiteButton" href="javascript:void(0);">whiteButton</a>
<a class="grayButton" href="javascript:void(0);">grayButton</a>
<a class="redButton" href="javascript:void(0);">redButton</a>
<a href="javascript:void(0);">just link</a>
<div>
<a class="button" href="javascript:void(0);">small button</a>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment