The images are stored in my folder and not in database. When i click on one of the images, it will lead me to see more info on the next page. This would means that i can see the image with a bigger size.
How do I do this with less php pages created? Below are snippets of my codes
<table>
<tr>
<th class="timgB"><h4><img src="city/GVcementMixture.jpg" style="vertical-align: text-bottom;" title="Cement Mixture"/> Cement Mixture </a></h4></th>
</tr>
</table>
You could keep it all in one form/page with a big if/else or switch/case statement to evaluate the selected image and show only info pertaining to the selected image such as the full size image or a sub-set of child images. But it would be best presented in jQuery as #Razor said.
<form ...>
<button type=submit name=imgID value=1>
<button type=submit name=imgID value=2>
...
<?php
if (isset($_POST['imgID'])):
// Show info related to selected image
...
you can do it like this. use class="small for make image size small and class="big-img" to big size image. the ?img=img23.jpg in your link decide which image should be shown with big size. or if you use thumbnail of image as small size and want to show a full size only when some one click on thumbnail then update the link in upper div (class="big-img") or leave comment.
//it will work as you want
<body>
<div class = "big-img"> <!-- set class to show big size image-->
<?php if(isset($_GET['img'])): ?>
<img src="city/.<?php echo $_GET['img']; ?>" alt="">
<?php endif; ?>
</div>
<table>
<tr><!-- set class to show small size image-->
<td class = "small"><img src="city/img23.jpg" alt=""></td>
<td class = "small"><img src="city/img24.jpg" alt=""></td>
<td class = "small"><img src="city/img25.jpg" alt=""></td>
</tr>
</table>
</body>
Related
im new in php programming, my problem is i want to zoom every image displayed in a while loop. here is my code..
$query = mysqli_query($conn,"SELECT * FROM room");
while($display = mysqli_fetch_assoc($query))
{
<tr>
<td>
<div id="imageContainer"><!-- zoom id -->
<div style="margin-left:15px;">
<img width=120 height=70 class="thumbnail" src='<?php echo $display['image'];?>'>
</div>
</div>
</td>
</tr>
So you must put there some javascript or jquery (and more frameworks :D) code that will zoom on them,php cant zoom on image.
And there is a question how you want to zoom them.There are many possibilities to do that.You have miniatures of your pics and click on them make them somewhere bigger or how ? And I think that you have even the code what you placed here bad you are combining html a php.
I have a database containing movies Name, their description and their cover picture. The cover picture field type is as blob and the problem is that I can't retrieve it from the database. I want to display the movie name along their cover picture beside them... How to do it.. Here is my code..
<?php
include ("php/connection.php");
$ID = $_GET['id'];
$listmovies = "SELECT * FROM movies where Genres LIKE '%$ID%'";
$result = mysql_query($listmovies);
while ( $row = mysql_fetch_assoc($result) ) {
?>
<table border="1" width="100%">
<tr>
<td rowspan="2" width="90" height="120">
<?php
// set the header for the image
header("Content-type: image/jpeg");
echo $row['Image'];
?> </td>
<td width="200" height="10">
<?php
echo $row['Title'];
?></td>
</tr>
<tr>
<td width="200" height="110">More Detail</td>
</tr>
<?php } ?> </table>
I just want to display The Imgaes beside the title of the movie?
Yes it won't display because any output above header would always generate error ... you need to have a different page to output your image or include it has base64 image
Remove
header("Content-type: image/jpeg");
echo $row['Image'];
And add this :
printf("<img src=\"data:image/jpeg;base64,%s\" />",base64_encode($row['Image']));
^--- Note this is only for jpeg images
I suggest something like that:
Make a new php file called for example image.php; That file will replace physical image file.
In that file you put the code from your post plus some logic to get image data from database;
In parent template(php file maybe) you put code for image:
<img src="image.php?id_movie=<?php echo $id_movie; ?>" width ="200" height="200" /> More Detail
In image.php i suggest to be careful at spaces outside php tags (at the beniging and at the end).
Also to image.php you need to give id of the movie to know what image to load from database.
I am having problem in fix layout of categories of video in firefox it works normally in google chrome but in firefox the table which is align center is leave its place and make horizontal scroll bar enable it need some expert hand in smarty I am showing the smarty coding please guys help me yiu guys can also check Page Where Firefox Givin Prob.
Check this page in Google Chrome and in Firefox its works well in Chrome but not in Firefox please help me
<div align="center">
<table border="0" align="center">
{section name=i loop=$cat step=4 max=6} <!--ROWS EG change max=???-->
<tr>
{section name=cat loop=$cat start=$smarty.section.i.index max=4}<!-- COLUMNS EG change max=??? to the ammount and step=??? to the same ammount-->
<td align="center"><b>{$cat[cat].name}</b><br /><img border="0" width="153" height="120" src="{$cat[cat].picture}" {if $firefox eq "1"}class="reflect" alt="No Image Yet"{/if} /></td>
{/section}
</tr>
{/section}
</table>
</div>
Put br as first element inside your div:
<div align="center">
<br/>
<table border="0" align="center">
.
.
or you can add a clearer after your search section:
.
.
</div>
<div style="clear:both"></div>
<div align="center">
.
.
The reason why the issue occurred is because your search section's div, which is float to left, overlaps your second div and pushes the table. After adding a clearer, the first div has something to push instead of your table.
i have bellow code which display 10 items and each item in each of table
<div class="baner_main shadow">
<div id="adds">
<div class="latest_ads">
<table border="0" cellspacing="0" style="width:800px">
<tbody>
<tr class="">
<?php
for($i=;$i<=10;$i++)
{
?>
<td class="even">
<img src="images/photo.gif" alt="" title=""><br>
<h3>Item Name</h3>
<p><strong>Price: 70.00 USD <br> () <br> December 3, 2011</strong></p>
</td>
<?php
}
?>
</tr>
</tbody>
</table>
</div>
</div>
</div>
in 800 width of table it only show 5 items on screen one time.
what i need is
Move the first item and bring the next five items automatically after 10 sec using Jquery.
A small dot under table to move items next and previous with jquery.
this is common in image slide shows but i can't find any idea how to do with table.
if available give me any example link and i will it myself.
Thanks
You can use jQuery cycle plugin http://malsup.com/jquery/cycle/ and check http://malsup.com/jquery/cycle/div.html for grouping set of items together. Most of the examples provided are Div based layouts. However, You can achieve the same effect using TD's as well. Let me know if you still need help
http://www.leandrovieira.com/projects/jquery/lightbox/ sample
so i have get images in while loop here is my code
<td id="gallery">
<a href='<?=$path ?>'>
<img width="50" height="50" src=<?php echo $path; ?> />
</a>
</td>
$(function() {
$('#gallery a').lightBox();
});
</script>
when i click first image light box effect works fine but when i click second image light box effect does n't work please guide me
Thanks for Advance
The problem is you have multiple <td id="gallery". You shouldn't use the same id for multiple elements, because $('#gallery') would always return the first one, but also because it's wrong!
Either move it into the table: <table id="gallery",
or change it to class: <td class="gallery" and change the query: $('.gallery a').lightBox();