Content editable on mobile
HTML
<script src="https://raw.github.com/jquery/jquery-color/master/jquery.color.js"></script>
<div id="editor" contenteditable="true">
Click here and type df#
</div>
CSS
body {
height: 300px;
width: 300px;
}
JavaScript
var editor = document.getElementById('editor');
if(typeof editor.contentEditable !== 'undefined') {
console.log('content editable');
} else {
console.log('not content edtiable');
}
if('ontouchstart' in window) {
console.log('we can use touch');
editor.ontouchstart = document.body.ontouchstart = function() {
console.log('touch start');
$('[contenteditable=true]').animate( { backgroundColor: 'pink' }, 1000);
}
window.ontouchend = function() {
console.log('touch end');
$('[contenteditable=true]').animate( { backgroundColor: 'white' }, 1000);
}
}