JQuery - fancyBox Click on a picture, Zoom display

Abstract: JQuery - fancyBox Click on a picture, Zoom display

Long time no write articles,

Under the circumstances did not work, it can provide no combat experience,

Fortunately, there will be some unexpected small Case,

I just did not do, earn a bit of extra money, so poor, I can hold a one or two week (weeping)

------------

The help of a friend of my brother, because the non-birth of this industry, to get a web page, because the digitization of content, took a bunch of photos, use the web page display,

For a long time did not touch the front, it should be said that the JavaScript, HTML, CSS, JQuery me,

It is not very good memory, has been mad with Google, fiddled West Minato, complete (I did not expect to do so seems to be very fast, four hours to two days to earn salaries within four hours, the caller said to me at least salary, oh, do not know why because the outside offer unusually high)

Program to the other side, the other side to give a lot of thanks, think I did very quickly, take the case of people not only outside talking rack server ah, how much, and he just static pages, I will not be just the server rack, I wrote static web pages can also say, then very happy, save his two days (he may not know how to do, it may take longer time)

I use JQuery by this technology, with DW not know can not do it.

And I deal with JavvaScript + JQuery + Json, let the program automatically adds the component or DOM Element, if the DW, do not know whether he would spend 250 times Ctrl + C, Ctrl + V.

Because there are 259 pictures, and each picture 266KB, I use a lot of software thumbnails, each figure will shrink to the width 200px, each moment into 35KB.

You will be able to show all on the same page.

http://briian.com/6561/easy-image-modifier.html

Then use javascript array, additional references data.js, so that the text of each figure can be mirrored.

Then using JQuery kit, fancyBox, tap amplification process.

http://fancyapps.com/fancybox/

For a long time did not do a website, grammar almost forgotten, memories again.

What I used CSS

display:inline;

float:left;

font-family: "标楷体","Times New Roman", Georgia, Serif;

font-weight: bold;

Clear: both; 

text-align = left: Center;

the display: none

Recall JSON how

indexs [1] = {start: 1, end: 2, category: ""};

recall JQuery how

var $ data = $ ( " DATAl # ") clone ();.

$ data.children (" IMG ") .attr (" Alt ", DATAS [I]);

$data.appendTo($("#div_list"));

Click the pop paradigm

						$data.fancybox({
							helpers: {
								title : {
									type : 'outside'
								},
								overlay : {
									speedOut : 0
								}
							}
						});		

The use of embedded links

Tab1

Title1

example pictures

If I wrote the words ......

Perhaps somehow within just one hour.

But did not get too long, so get four hours (weeping, fortunately for a lot of money for me ......)

Original: Big Box  JQuery - fancyBox Click on a picture, Zoom display