I have a website with a gallery set of pictures I'm working on. The client wants the pictures to be enlarged when users click on them. They are ok with them just opening a link to the picture on a white page that is the path of the picture. I.E http://web.com/folder/picture.jpg.
我有一个网站,上面有我正在制作的图库集。客户希望在用户点击图片时放大图片。他们可以在他们只是打开白色页面上图片的链接,这是图片的路径。 I.E http://web.com/folder/picture.jpg。
There are a lot of pictures is there anyway using html, css, or php to to make the pictures automatically link to themselves?
有很多图片,无论如何使用HTML,CSS或PHP来使图片自动链接到自己?
Or
Would it be better to figure out how to make the pictures enlarge themselves after you place the mouse over them for a second or two?
将鼠标放在它们上一两秒之后,弄清楚如何让图片放大是不是更好?
3 个解决方案
#1
1
About the animation for opening the images, you should look at javascript plugins, the term you are looking for is lightbox.
关于打开图像的动画,你应该看一下javascript插件,你要找的术语是lightbox。
About the 'autoloading' of images, you should take a look at PHP. The fastest why to do that is by loading all the images in a gallery into a separate directory in two sizes (for example /images/thumbs/image_1.jpg and /images/full/image_1.jpg) - use batch resize and save them consistently. That what you do with the PHP is, that you read the directory with this:
关于图像的“自动加载”,你应该看一下PHP。最快的原因是将库中的所有图像加载到两个大小的单独目录中(例如/images/thumbs/image_1.jpg和/images/full/image_1.jpg) - 使用批量调整大小并保存它们一致。那你用PHP做的是,你用这个读取目录:
$imgs_per_div = 4;
$i = 1;
$images_in_dir = glob("images/thumbs/*.jpg");
foreach ($images_in_dir as $thumb_image)
{
$filename = basename($thumb_image);
$large_image = 'images/full/' . $filename;
if ($i == 1 || $i % $imgs_per_div == 0)
echo '<div>';
echo "<a href='$large_image'><img src='$thumb_image'/></a>";
if ($i % $imgs_per_div + 1 == 0 || $i == count($images_in_dir))
echo '</div>';
$i++;
}
I haven't tested the code but it should work for you by setting the correct path to images. This should draw out all images in the preset directory.
我没有测试过代码,但它应该通过设置正确的图像路径来为您工作。这应该绘制预设目录中的所有图像。
#2
1
it sounds like your hand coding the html/images? you should be using php to loop through all the images and build the html that way
听起来像你的手编码html /图像?你应该使用PHP循环遍历所有图像并以这种方式构建html
edit: you should look into using the jquery plugin called fancybox for displaying the full size images, its simple and looks professional
编辑:你应该考虑使用名为fancybox的jquery插件来显示全尺寸图像,它简单而且看起来很专业
#3
1
Consider using a lightbox. They are quite easy to code, and help to create a great user experience. There are also many ready made scripts that you can use by just modifying a couple lines of your code.
考虑使用灯箱。它们非常易于编码,有助于创建出色的用户体验。还有许多现成的脚本,只需修改几行代码即可使用。
#1
1
About the animation for opening the images, you should look at javascript plugins, the term you are looking for is lightbox.
关于打开图像的动画,你应该看一下javascript插件,你要找的术语是lightbox。
About the 'autoloading' of images, you should take a look at PHP. The fastest why to do that is by loading all the images in a gallery into a separate directory in two sizes (for example /images/thumbs/image_1.jpg and /images/full/image_1.jpg) - use batch resize and save them consistently. That what you do with the PHP is, that you read the directory with this:
关于图像的“自动加载”,你应该看一下PHP。最快的原因是将库中的所有图像加载到两个大小的单独目录中(例如/images/thumbs/image_1.jpg和/images/full/image_1.jpg) - 使用批量调整大小并保存它们一致。那你用PHP做的是,你用这个读取目录:
$imgs_per_div = 4;
$i = 1;
$images_in_dir = glob("images/thumbs/*.jpg");
foreach ($images_in_dir as $thumb_image)
{
$filename = basename($thumb_image);
$large_image = 'images/full/' . $filename;
if ($i == 1 || $i % $imgs_per_div == 0)
echo '<div>';
echo "<a href='$large_image'><img src='$thumb_image'/></a>";
if ($i % $imgs_per_div + 1 == 0 || $i == count($images_in_dir))
echo '</div>';
$i++;
}
I haven't tested the code but it should work for you by setting the correct path to images. This should draw out all images in the preset directory.
我没有测试过代码,但它应该通过设置正确的图像路径来为您工作。这应该绘制预设目录中的所有图像。
#2
1
it sounds like your hand coding the html/images? you should be using php to loop through all the images and build the html that way
听起来像你的手编码html /图像?你应该使用PHP循环遍历所有图像并以这种方式构建html
edit: you should look into using the jquery plugin called fancybox for displaying the full size images, its simple and looks professional
编辑:你应该考虑使用名为fancybox的jquery插件来显示全尺寸图像,它简单而且看起来很专业
#3
1
Consider using a lightbox. They are quite easy to code, and help to create a great user experience. There are also many ready made scripts that you can use by just modifying a couple lines of your code.
考虑使用灯箱。它们非常易于编码,有助于创建出色的用户体验。还有许多现成的脚本,只需修改几行代码即可使用。