Fancybox1.3.1 Jquery-based plug-in Image Display problem in IE _ jquery

There are also many plug-ins in the JQuery pop-up window, such as Lightbox... We will introduce the excellent Plugin-Fancybox. Main features:

Display HTML, swf, Iframe, and ajax requests
Allows you to scroll over an image.
Supports shadow and zoom in
Customize CSS and add navigation buttons
The official website provides more detailed APIs and How to Use them. We will not describe How to Use them here. You can refer to the official website. Let's take a look at the sample code:

The Code is as follows:

Var selectedid = $ ("select [name $ = DdlSearchProfile]"). val ();
Var selectedtxt = $ ("select [name $ = DdlSearchProfile]: selected'"). text ();
$ ("# Editsp"). fancybox ({
Ajax :{
Type: "POST ",
Data: "selectedid =" + selectedid + "& selectedtxt =" + selectedtxt,
Cache: false
},
AutoDimensions: false,
Width: 300,
Height: 125,
Scrolling: 'no ',
// OnStart: OnStartCheck,
OnComplete: OnshowtxtForEdit,
TitleShow: false,
EnableKeyboardNavigation: false
});

Here we use ajax to load a page and pass the value. We can obtain the corresponding Data from the Server. The above Id, text. OnComplete is a CallBack, and we should know it if we are familiar with JQuery. It provides several CallBack functions that you can call in specific scenarios.

Next we will solve the problem that the Close button image cannot be displayed in IE. We can see that its CSS uses the AlphaImageLoader Filter. For details about how to use this Filter, refer to this POST

One way is to use absolute Path, such:
1: AlphaImageLoader (src = 'HTTP: // yourdomain.com/js/fancybox/ fancy_loading.png '..

Another scheme is to use JavaScript, open jquery.fancybox-1.3.1.css, mentioned # fancybox-loading.fancybox-ie p with the following code:

. Fancybox-ie # fancybox-close {background: transparent; behavior: expression (this. runtimeStyle. filter? '': This. runtimeStyle. filter = "progid: DXImageTransform. microsoft. alphaImageLoader (src = '"+ (function () {var t = document. getElementsByTagName ('link'); for (var I = 0; I It looks a bit funy, using Javascript in css.

Then, we can use IE 8.0.7600.16385. Fancybox 1.31. The best solution is to implement custom styles. Fancybox is also used for this website. Refer:

Http://www.microsoft.com/express/windows/ href = "http://www.microsoft.com/express/windows/"> http://www.microsoft.com/express/windows/

I hope this POST will be helpful for your development.