Show title when I hover image connected to mysql using php - php

I want to show the image title when hovered to the image connected to mysql using php.
Here are the code I used.
<div class="galleryko">
<?php $data = mysql_query("SELECT * FROM tbl_gallery_featured")?>
<div class="lalagyan1">
<?php while($row = mysql_fetch_assoc($data)):?>
<div class="lalagyan">
<div id="wew">
<img src="admin/featured/<?php echo $row['photo']?>" style="width:150px; height: 150px;"/></br>
</div>
</div>
<?php endwhile?>
</div>
</div>
Then I tried to insert a TITLE inside the code of
<img src="admin/featured/<?php echo $row['photo']?>" style="width:150px; height: 150px;"/></br>
But when I hover the images after I did, what happened was, all images are entitled with SOMETEXT, Now I want to show the TITLE of an IMAGE seperately.
Some one please solve my problem,. Thank you in advance! :)

Remove title="SOMETEXT" and add something like this to img tag alt="$row['title']"

<img src="admin/featured/<?php echo $row['photo']?>" style="width:150px; height: 150px;"/>

Related

How to Display image that coming from PHP file with id?

I have Image path like http://sits.in/imageDemo/image.php?image=R171-1.jpg in data base.
I can not load image in php by simply putting image link http://site.in/imageDemo/image.php?image=R171-1.jpg as src.
My code look like this
<?php
$count = 1;
while ($row = mysqli_fetch_array($result)) {
?>
<br>
<br>
<div class="card " style="width: 800px; margin-bottom: 25px;">
<div class="card-body">
<!-- <h5 class="card-title"><b>Product Number : <?php echo $count; ?> </b></h5> -->
<p>Order Id : <?php echo $row['orders_id']; ?></p>
<p>Product Name : <?php echo $row['product_name']; ?></p>
<img src="<?php echo $row['image1']; ?>" class="card-img-bottom" alt="Product Image"
style="width: 100px; height:100px">
</div>
<?php } ?>
I think you need to store path like that in your database
http://sits.in/imageDemo/R171-1.jpg
Also, create folder imageDemo in your local and store image as R171-1.jpg
If you want to use php file as image you need to make that php file to be shown as image file. Use GD libary. More info about how to use it for jpg here: https://www.php.net/manual/en/function.imagecreatefromjpeg.php

display images from database in horizontal way

hi this is my code which display images from mysql database
<?php
error_reporting(0);
include_once 'dbconfig.php';
$id=$_POST['id'];
$q="select * from services ";
$qq=mysql_query($q)
or die(mysql_error());
while($row=mysql_fetch_array($qq)){
$s1=$row[image];
?>
<?php
$p1="admin/services/uploads-services/";
echo '<img src="'.$p1.$s1.'" class="img-responsive" alt="Blog Image">'; ?>
<?php } ?>
it appears in vertical way but i want to make it appear in horizontal way
how can i do this ?
If you want images to be in same row, add display: inline-block to them.
.img-responsive {
display: inline-block;
}
Probably because you visualize the images not in a defined col. If you want to visualize 3 images at a line, you should have
<div class="col-md-12">
<div class="col-md-4">
put your image here
</div>
<div class="col-md-4">
put your image here
</div>
<div class="col-md-4">
put your image here
</div>

Fotorama thumbnails creation dynamically using php

<div class="fotorama" data-width="700" data-ratio="700/467" data-max-width="100%" align="center" data-arrows="true" data-click="false" data-swipe="false" data-autoplay="2000" data-nav="thumbs">
<?php
$query="select * from released_movies" ;
$queryr=$con->query($query);
while($row=$queryr->fetch_assoc()) { ?>
<div>
<a href="single.php?id=<?php echo $row['rel_id'];?>">
<img u="image" src="../AbaamAdmin/Released_Movies/<?php echo $row['rel_movies_pics'];?>" />
</a>
</div>
<?php }?>
</div>
I need to create a fotorama gallery slideshow with thumbnails of the larger image. But by giving the above code, no image appears as thumbnail instead I got only a thumbnail border. How I will get the thumbnail image there dynamically. Thanks in advance.

Table repeat region

I am pulling two different variables from the database. A name, and an image path. I want to display this on the page to look like this:
|Image 1|Image 2|Image 3|
|Name 1 |Name 2 |Name 3 |
I currently have this code:
<?php do { ?>
<img src="<?php echo $row_UserInfo['image_path'];?>" width="150" height="150"/>
<a href="HorseProfile.php?recordID=<?php echo $row_UserInfo['id']; ?>"style="color:#000000; text-decoration: none; text-align: center;">
<?php echo $row_UserInfo['Name']?></a>
<?php } while ($row_UserInfo = mysql_fetch_assoc($UserInfo)); ?>
I tried to add a break after the image so that the name goes right under it, but then when the next image appears, it goes next to the name before. I know this is probably extremely simple, but this has been a problem for me for a while and if someone could open my eyes and show me what I'm doing wrong, that would be deeply appreciated.
You should enclose your image and link in a div, and then float the div. Here is an example:
<?php do { ?>
<div style="float:left;">
<div>
<img src="<?php echo $row_UserInfo['image_path'];?>" width="150" height="150"/>
</div>
<div>
<a href="HorseProfile.php?recordID=<?php echo $row_UserInfo['id']; ?>"style="color:#000000; text-decoration: none; text-align: center;">
<?php echo $row_UserInfo['Name']?>
</a>
</div>
</div>
<?php } while ($row_UserInfo = mysql_fetch_assoc($UserInfo)); ?>

How to avoid images being displayed in one column

I am developing a gallery website where users can visit images that other people have shared. I have created the gallery and images can be viewed using thumbnails and the images upload from the right of the previsous image. If an image is at the edge of the page the next image will go in the row beneath it. I use this code to do this:
<?php
mysql_connect("localhost","root","");
mysql_select_db("pardeepsandhu");
$res= mysql_query("select * from images");
$row=mysql_fetch_array($res)
?>
<div id="w">
<div id="content">
<div id="images"><?php while ($row=mysql_fetch_array($res)){?>
<img src="<?php echo $row["Image"]; ?>" height="134.1175" width="134.1175" border="5" alt="turntable" />
<?php } ?>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$('#images a').lightBox();
});
</script>
However, i am now trying to get a voting system set up. At the bottom of each image there would be a button which will give an image a like. The button works however the images, with the buttons, are being laid out differently. All the images appear one beneath the other, it looks like they are in on column. I don't want this to happen as space will be wasted. This is the code with a button:
<div id="w">
<div id="content">
<div id="images"><?php while ($row=mysql_fetch_array($res)){?>
<img src="<?php echo $row["Image"]; ?>" height="134.1175" width="134.1175" border="5" alt="turntable" />
<form id="form1" name="form1" method="post" action="">
<input type="submit" name="button" id="button" value="Like this image" />
</form>
<?php } ?>
How do I get the images to load like they did before, so that they appear in rows rather than in one column. Can anyone help me?
To achieve a horizontal layout, you will need to use the css "display:inline-block;" on all of your image / link containers. If I were you, I would have another div which contains all the image and voting info. Also, please make sure you are closing all of your divs as this can dramatically change your layout.
Something along the lines of this should get them horizontal.
<div id="pic" style="display: inline-block;">
<img src="">
<form></form>
</div>
http://jsfiddle.net/u9gSD/

Categories