jquery - Using Lightbox plugin with blob from mysql database
Question
So I am trying to incorporate the LightBox plugin in order to have pop up images: LightBox Info
However my php code code uses an img tag rather than an a tag as Lightbox so requires. It seems the href and src conflicts when I try it. The images and everything display correctly and it is just a matter of using LightBox with my code. I was wondering if any of guys know how to do it.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script src="/var/www/html/jquery-1.11.3.min.js"></script> <script src="/var/www/lightbox2-master/dist/js/lightbox.js"></script> <title>Greeting Cards</title> <link rel="icon" type="image/png" href="../../favicon-32x32.png" sizes="32x32" /> <link rel="icon" type="image/png" href="../../favicon-16x16.png" sizes="16x16" /> <link rel="icon" type="image/x-icon" href="../../chromevers.ico" /> <link rel="stylesheet" type="text/css" href="../../styles/catbar.css"> <link rel="stylesheet" href="/var/www/lightbox2-master/dist/css/lightbox.css"> </head> <body> <?php include '/var/db_file.php'; include '/var/www/WideImage/lib/WideImage.php'; $con = mysqli_connect($theDb,$usr, $pass, "images"); mysqli_select_db($con, "images"); $query = "SELECT * FROM Greeting_Cards"; $result = mysqli_query($con, $query); $images = array(); while($row = mysqli_fetch_assoc($result)){ $images[] = $row['image']; } echo '<div id ="gallery">'; foreach ($images as $image) { $image = WideImage::loadFromString($image)->resize(300, 300); echo '<img id="database" src="data:image/jpeg;base64,'. base64_encode($image) .'" />'; } echo '</div>'; mysqli_close($con); ?> </body> </html>
Thank you!
1 answers
solution1
0 2017-07-06 23:01:30
I managed to display my images another way. I uploaded the images to the server and stored the image path on the database. This way would make your website faster since you wouldn't be pulling a BLOB for lots of images and just would reference them on your server. Here is the line of code:
echo '<a href="'. $image.'" data-lightbox="roadtrip"><img id="dbImages" src="data:image/jpg;base64,'.base64_encode($reimage).'"/></a>';
The $image variable is the $row = mysqli_fetch_assoc() call storing the image path. And $reimage is using the php library WideImage to load an image from path. That library also has lots of other very useful image manipulation functions that you can use. Hope this helped!
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.