I'm using http://retinajs.com/ (Retina.js) for my portfolio site. Retina.js requires the @2x image to be placed within the same directory using the same file name and extension. For example, image01.jpg will be replaced with image01@2x.jpg when retina.js notices that a device is using a higher DPI.
My problem is that I'm also using the PHP glob function to retrieve all of the image files within a directory and display them on a page. This means that it also pulls the @2x image at the same time even on a normal 72 dpi screen. But the @2x image is only supposed to load on a screen with a higher DPI.
My simple PHP code is:
$files = glob('images/projects/'.$filename.'/*.{jpg}', GLOB_BRACE);
foreach($files as $file) {
echo '<img src="'.$file.'" title="'.$title.'" />';
}
Is there any way of making retina.js and PHP glob work together? My aim to to pull all of the images within a directory except the @2x image for a normal 72dpi screen.
Thanks in advance!
The simple way:
foreach($files as $file) {
//check that the file doesn't have @2x in the name.
if(strpos($file, '@2x')===false){
echo '<img src="'.$file.'" title="'.$title.'" />';
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.