mootools_MooTools，mediaboxAdvanced和墨西哥-白红宇

mootools

The lightbox is probably one of my favorite parts of the Web 2.0 revolution. No more having to open new windows (which can bog down your computer quite a bit) to see a larger image, video, etc. Instead, the item loads right into the page quickly. During my recent trip to Mexico, I made sure to take a bunch of pictures and videos so I could highlight my favorite MooTools lightbox: .

灯箱可能是Web 2.0革命中我最喜欢的部分之一。无需再打开新窗口(这可能会使您的计算机停滞不前)来查看较大的图像，视频等。相反，该项目会快速加载到页面中。在最近的墨西哥之旅中，我确保拍摄了一堆照片和视频，以便突出显示我最喜欢的MooTools灯箱：。

Media box is an all-encompassing lightbox that allows you to open images, videos, static content, etc. while being highly customizable. I've taken advantage of mediaboxAdvanced to show you pictures and videos from Monterrey, Mexico.

媒体盒是一个无所不包的灯箱，可让您在高度自定义的同时打开图像，视频，静态内容等。我利用mediaboxAdvanced向您展示了来自墨西哥蒙特雷的图片和视频。

PHP-> XHTML (The PHP --> XHTML)

/* settings */ $dir = 'my/dir/path';$ignore_files = array('.','..');$thumb_dir = 'small/';$large_dir = 'large/';$photos_per_row = 4;$count = 0;/* read in directory */$handle = opendir($dir.$thumb_dir);while (false !== ($file = readdir($handle))){	if(!in_array($file,$ignore_files))	{		//video or image?		if(strstr($file,'.flv'))		{			if(strstr($file,'.jpg'))			{				echo ''."\n";				$count++;			}		}		else		{			echo ''."\n";			$count++;		}		if($count % $photos_per_row == 0) { echo '
    
'; }	}}

We read in the thumbnails directory and output its contents. I've placed the settings on top so you can customize this any way you'd like.

我们读入缩略图目录并输出其内容。我将设置放在最前面，因此您可以根据需要自定义此设置。

CSS (The CSS)

a.image	{ width:250px; height:190px; display:block; float:left; margin:0 0 20px 20px; border:1px solid #ccc; background:#eee; padding:5px; }a.flv		{ border-color:#6d84b4; background:#eceff5; }.clear	{ clear:both; }

Simple CSS to set the size of thumbnail anchors. Set these properties however you'd like. Also note that we must included mediaboxAdvanced's stylesheet.

简单CSS来设置缩略图锚点的大小。根据需要设置这些属性。还要注意，我们必须包含mediaboxAdvanced的样式表。

MooTools JavaScript (The MooTools JavaScript)

None. None? Yes, none. mediaboxAdvanced takes care of this for us. You can, however, place your own directives in the page without problems using .

没有。没有？是的，没有。 mediaboxAdvanced会为我们解决这个问题。但是，您可以使用在页面中放置自己的指令而不会出现问题。

A good lightbox takes care of all circumstances and requires minimum user knowledge (in my opinion). mediaboxAdvanced can only be described as awesome.

一个好的灯箱可以照顾所有情况，并且需要最少的用户知识(我认为)。 mediaboxAdvanced只能说很棒。

对于那些关心... (For Those Who Care...)

A few notes from my trip:

我的旅行记录：

The food was outstanding. I feel like I gained 200 lbs while I was there.
食物很棒。我感觉在那里的时候我体重增加了200磅。

The driving in Mexico was absolutely insane. I was praying every time I got into the vehicle. Cars come out of nowhere and you hear more honking in one trip than you have ever in your life. A normal drive in Mexico would get you pulled over 5 times in the US.
在墨西哥开车绝对是疯了。每当我上车时我都在祈祷。汽车无处不在，一生中听到的鸣叫声比您一生中听到的还要多。墨西哥的正常开车将使您在美国开车超过5次。

In Mexico, you park wherever and however you want. Park in the street? Sure. Park right on someone's bumper? Why not? Block traffic? Claro que si.
在墨西哥，您可以将车停在任何地方，但是可以随心所欲。停在街上？当然。停在某人的保险杠上吗？为什么不？封锁交通？克拉罗·奎斯

The mountains are beautiful...when you can see them. The weather sucked every day except the morning we left. Very foggy and rainy.
山脉很美...当您可以看到它们时。除我们离开的早晨外，每天的天气都很糟糕。大雾和多雨。

I got called "Kid Rock" and "Kurt Cobain" multiple times. I always get offended when I hear that but...I guess if I'm getting called that in another country, it's confirmed. Damnit!
我多次被称为“孩子摇滚”和“库尔特·科本”。听到这个消息我总是很生气，但是...我想如果我在另一个国家被打来电话，那就可以了。该死的！

I never felt in danger by any person on the street but my girlfriend's relatives and family friends all told me (because I'm whiter than ) to "behave to avoid being kidnapped." I felt like a moving target everywhere I went.
我从来没有在街上遇到任何人感到危险，但我女友的亲戚和家人朋友都告诉我(因为我比更白)“要避免被绑架”。我到处都感觉像是一个移动的目标。

I'm not a "wedding dancer" but everyone there told me I needed to dance at a Mexican wedding. So I did. Liquid courage is underrated.
我不是“婚礼舞者”，但那里的每个人都告诉我，我需要在墨西哥婚礼上跳舞。所以我做了。流动的勇气被低估了。

I got to take a shot of tequila in Mexico with friends so that goal was accomplished.
我必须和朋友在墨西哥拍龙舌兰酒，以实现目标。

I got to play a soccer game in Mexico so that goal was also accomplished.
我必须在墨西哥踢足球，因此也实现了目标。

The Apple store in Monterrey isn't as nice as it is here, obviously. I thought you'd all enjoy the picture though.
显然，蒙特雷的苹果商店不如这里的好。我以为你们都会喜欢这张照片。

There's no such thing as "on time" in Mexico. You set an hour and then show up anywhere within 2 hours of that time.
在墨西哥，没有“准时”这样的事情。您设置一个小时，然后在该时间的2个小时内显示在任何地方。

I made sure to rep Moo while I was down there, which you'll see in the photos.
当我在那儿时，我确定要代表Moo，您会在照片中看到它们。

I couldn't buy one thing for myself in Mexico. My girlfriend's family's was too generous!
我无法在墨西哥为自己买一件东西。我女友的家人太慷慨了！

The importance of family was very apparent. Kisses on the cheeks of women and handshakes to the men every time we saw them. Makes me feel bad for the way I interact here.
家庭的重要性非常明显。每次我们见到女人时，都会亲吻女人的脸颊并与男人握手。让我对在这里互动的方式感到难过。

Although the women in Monterry were beautiful, my girl was still the most beautiful.
尽管蒙特里的女人很漂亮，但我的女孩仍然是最漂亮的。

My girlfriend's family was very patient with my Spanish which I appreciated. I did pretty well with what I remembered but I need to study up.
我女友的家人对我的西班牙语非常耐心，对此我表示赞赏。我的回忆做得很好，但我需要学习。

I heard more American music in Mexico than Mexican music. We went to a place called Woodstock and all they sang was American music songs. All the stores at the mall played American music.
在墨西哥，我听到的美国音乐比墨西哥音乐多。我们去了一个叫伍德斯托克的地方，他们所唱的只是美国音乐歌曲。购物中心的所有商店都播放美国音乐。

This young couple (like 16 years old) was making out at the street corner for like 5 minutes while we were at a red light. I yelled "get a room!" at them in Spanish right as we drove off. Hilarious.
这对年轻的夫妇(大约16岁)在红灯前在街角走了大约5分钟。我大喊“找个房间！” 我们开车离开时，以西班牙语对他们说话。搞笑

I had a blast and look forward to returning soon!

我大受鼓舞，期待很快回来！

翻译自:

mootools