asp.net中的图像查看器 [英] Image Viewer in asp.net

问题描述

你好，

如何开发从数据库加载图像的图像查看器，从数据库加载图像后，如何在这些图像上应用jquery以应用效果.

那是我使用过的服务器端，它从文件夹中加载图像.单击特定图像后，它将加载到单独的窗口中.我想在Click上使用JQuery类型的效果，例如facebook类型的图像效果等.

Hello,

How to develop image viewer, which loads images from database, after loading images from database, how to apply jquery on these images to apply effects.

That is my server side, which i have used, it loads images from folder. After clicking on particular image it loads in separate window. I want JQuery type effect on Click, for example facebook type image effect etc.

int index = 1;
          DirectoryInfo di = new DirectoryInfo(Server.MapPath("~/"+CarImages.ToString()+""));
          foreach (FileInfo fi in di.GetFiles())
          {
              ImageButton img = new ImageButton();

              img.ID = "img" + index.ToString();
              img.Width = Unit.Pixel(100);
              img.Height = Unit.Pixel(100);
              img.BorderStyle = BorderStyle.Outset;
              img.BorderWidth = 10;
              img.BorderColor = Color.Black;

              img.ImageUrl = "~/"+CarImages.ToString()+"/" + fi.Name;
              ImgPlaceHolder.Controls.Add(img);

              img.Attributes.Add("onclick", "javascript:window.open('" + "../"+CarImages+"/" + fi.Name + "');return false;");
              Literal lit = new Literal();
              lit.Text = "  ";
              ImgPlaceHolder.Controls.Add(lit);
              index++;
          }

任何帮助将不胜感激.
感谢所有在这方面指导我的人.
问候.

Any help will be appreciated.
Thanks all who will guide me in this regard.
Regards.

推荐答案

Hello Babar，
我已经为诸如facebook之类的滑块制作了一个示例.
它不一样，但看起来像Facebook的滑块.
请检查此链接 [ ^ ]，其中包含完整的示例，并按照以下步骤将其应用于您的网站
1-复制fancybox文件夹&将jquery-1.4.3.min文件上传到您网站的内容
2-在设计页面的head标签中包含以下代码

Hello Babar ,
I have made an example for the slider like facebook .
it''s not the same but it looks like facebook''s slider.
Please check this link[^] which includes full example and follow the next steps to apply it to your site
1- Copy fancybox Folder & jquery-1.4.3.min file to ur site''s content
2- include the following code in the design page in the head tag

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript">
        !window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>');
	</script>
    <script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
	<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>
	<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" />
    <script type="text/javascript">

(文档).ready(功能(){ /* *示例-图片 */

(document).ready(function () { /* * Examples - images */

(" ).fancybox();

("a#example1").fancybox();

这篇关于asp.net中的图像查看器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！