Setting or changing background images with jQuery is super simple:
$('html').css('background-image','url("../../images/photo.png")');
This is the easiest way to detect if your smartphone (Android, iPhone, …) or tablet device (iPad, Galaxy Tab, …) is in portrait mode or landscape mode:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | function doOnOrientationChange() { switch(window.orientation) { case -90: case 90: alert('landscape'); break; default: alert('portrait'); break; } } window.onorientationchange = function() { doOnOrientationChange(); }; // Initial execution doOnOrientationChange(); |
The code also detects if the screen orientation has changed.
You can get the name of a file without it’s extension in Java by using the FilenameUtils of Apache Commons IO:
1 2 3 4 5 6 7 8 9 10 11 12 | import java.io.File; import org.apache.commons.io.FilenameUtils; public class NewMain { public static void main(String[] args) { File file = new File("C:/This/is/a/test.txt"); String fileNameWithOutExtension = FilenameUtils.removeExtension(file.getName()); System.out.println(fileNameWithOutExtension); // prints 'test' } } |
Another approach without using external libraries is:
1 2 3 4 5 6 | File file = new File("C:/This/is/a/test.txt"); String fileNameWithOutExtension = file.getName(); int index = fileNameWithOutExtension.lastIndexOf('.'); if (index != -1) fileNameWithOutExtension = fileNameWithOutExtension.substring(0, index); System.out.println(fileNameWithOutExtension); // prints 'test |
There are a lot of ways to detect touchscreen devices with JavaScript. Here are my favorites:
function isTouchDevice(){ return (typeof(window.ontouchstart) != 'undefined') ? true : false; }
function isTouchDevice(){ return ('ontouchstart' in window) ? true : false; }
function isTouchDevice(){ return 'ontouchstart' in window; }
Execution:
if(isTouchDevice()) alert('Touch me!'); else alert('Click me!');
A DOM element can have only one direct parent. So if you want to add the same element to multiple containers you need to clone it. This can be done with JavaScript using cloneNode(deep). The variable deep is a boolean value which tells whether to include child elements or not.
Sample:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Append DOM Element twice with JavaScript</title>
<style type="text/css">
* { margin: 0; padding: 0; border: 0; }
</style>
</head>
<body>
<div id="container1"></div>
<div id="container2"></div>
<script type="text/javascript">
var text = document.createElement('p');
text.innerHTML = 'Hello World!';
document.getElementById('container1').appendChild(text);
document.getElementById('container2').appendChild(text.cloneNode(true));
</script>
</body>
</html>If you don’t want that the user can scroll your website (to disable the bump-effect on iPhones and iPads for example), then you can use this code snippet which prevents the scrolling on mobile/touch devices:
<script type="text/javascript"> function preventDefaultScrolling(event){ event.preventDefault(); } document.ontouchstart = document.ontouchmove = document.ontouchend = preventDefaultScrolling; </script>
For re-enabling the default scrolling behavior you can do the following:
<script type="text/javascript"> function restoreDefaultScrolling(event){ return true; } document.ontouchstart = document.ontouchmove = document.ontouchend = restoreDefaultScrolling; </script>
0