Hover your mouse over for three seconds to display a large image

Website: Dalian fireworks

Http://dlyh365.com

<Style>
* {Margin: 0; padding: 0; list-style-type: none ;}
Img, a {border: 0 ;}
. Piccon {height: 75px; margin: 100px 0 0 50px ;}
. Piccon li {float: left; padding: 0 10px ;}
# Preview {position: absolute; border: 1px solid # ccc; background: #333; padding: 5px; display: none; color: # fff; z-index: 2000 ;}
</Style>

<Script type = "text/javascript">
This. imagePreview = function (){

XOffset = 10;
YOffset = 30;
Var urll;
$ (". Widget. ks-content a,. box. ks-switchable-content div li a"). hover (function (){
// $ (". Widget. ks-content a"). hover (function (e ){
// Var goods_id = $ (this). attr ("href"). replace ("goods /","");
Var goods_id = $ (this). attr ("href"). replace ("index. php? App = goods & id = ","");
This. t = this. title;
This. title = "";
Var c = (this. t! = "")? "<Br/>" + this. t :"";

$. Post ("index. php? App = default & act = ajaxBigImage ", {goods_id: goods_id}, function (data ){
$. AjaxSettings. async = false;
If (data! = 0 ){
Urll = data;

$ ("Body "). append ("<div id = 'preview'> ");
Return true;
} Else {
Return false;
}
});
/*
$ ("# Preview ")
. Css ("top", (e. pageY-xOffset) + "px ")
. Css ("left", (e. pageX + yOffset) + "px ")
. FadeIn ("fast ");
*/
Certificate ('{preview'}.css ({
Position: 'absolute ',
Left: ($ (window). width ()-$ ('# preview'). outerWidth ()/2,
Top: ($ (window). height ()-$ ('# preview'). outerHeight ()/2 + $ (document). scrollTop ()
});

SetTimeout (function (){
$ ("# Preview"). fadeIn ("fast ");
}, 3000)


},
Function (){
This. title = this. t;
$ ("# Preview"). remove ();
});

/*
$ ("A. preview"). mousemove (function (e ){
$ ("# Preview ")
. Css ("top", (e. pageY-xOffset) + "px ")
. Css ("left", (e. pageX + yOffset) + "px ");
});
*/

};

$ (Document). ready (function (){
ImagePreview ();
});

</Script>

<Div id = "_ widget_579" name = "jdr_sale_list" widget_type = "widget" class = "widget">
<Div class = "sale_list mt10 clearfix">
<H2> sales ranking
<Div>
<Ul class = "ks-nav ks-nav1476271702">
<Li class = "ks-active nav1"> special effect gift </li>
<Li class = "nav2"> set fireworks </li>
</Ul>
<Div class = "ks-content">
<Ul class = "box" id = "box00001476271702">
<Li>
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 331 "> </a> <B> 1 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 331 "> [81 fa liujin series combination fireworks] </a> </div>
<Div class = "price"> ¥ 200. 00 </div>
</Div>
</Li>
<Li>
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 336 "> </a> <B> 2 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 336 "> [Eight-happiness fireworks] Wufu linmen, liuliuda Shun, Qixing gaozhao, Bafang profit </a> </div>
<Div class = "price"> ¥ 180. 00 </div>
</Div>
</Li>
<Li>
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 375 "> </a> <B> 3 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 375 "> [Wufu series combination fireworks] fuyun changliu, fumanren, fushou mantang, furu Donghai, and Fu lailai </a> </div>
<Div class = "price"> ¥ 260. 00 </div>
</Div>
</Li>
<Li style = "border-color: # fff;">
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 399 "> </a> <B> 4 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 399 "> family fun combination fireworks \ little Lihua </a> </div>
<Div class = "price"> ¥ 480. 00 </div>
</Div>
</Li>
</Ul>
<Ul class = "box box2" id = "box2_1476271702" style = "display: none;">
<Li>
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 310 "> </a> <B> 1 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 310 "> fireworks package-sun mantang </a> </div>
<Div class = "price"> ¥ 888. 00 </div>
</Div>
</Li>
<Li>
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 305 "> </a> <B> 2 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 305 "> fireworks package-liuliuda shun </a> </div>
<Div class = "price"> ¥ 666. 00 </div>
</Div>
</Li>
<Li>
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 303 "> </a> <B> 3 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 303 "> package fireworks-all the way SHUNFA </a> </div>
<Div class = "price"> ¥ 1,688.00 </div>
</Div>
</Li>
<Li style = "border-color: # fff;">
<Div class = "pic"> <a href = "index. php? App = goods & amp; id = 300 "> </a> <B> 4 </B> </div>
<Div class = "info">
<Div class = "title"> <a href = "index. php? App = goods & amp; id = 300 "> fireworks package-happy events </a> </div>
<Div class = "price"> ¥ 1,288.00 </div>
</Div>
</Li>
</Ul>
</Div>
</Div>
</Div>

 

Backend Processing

// Ajax
Function ajaxBigImage ()
{

If (! Empty ($ _ POST ['goods _ id']) {
$ Goods_id = $ _ POST ['goods _ id'];

$ Goodsimg_mod = & m ('goodsimage ');
$ Uploadedfile_mod = & m ('uploadfile ');
// $ File_id = $ goodsimg_mod-> getOne ("select file_id from 'ecm _ goods_image 'WHERE goods_id = {$ goods_id} order by file_id DESC ");

// Obtain the file_id string
$ File_arr = $ goodsimg_mod-> getCol ("select file_id from 'ecm _ goods_image 'WHERE goods_id = {$ goods_id} order by file_id DESC ");
If (! Empty ($ file_arr )){
$ File_str = implode (",", $ file_arr );
}
// Echo $ file_str;

$ Url_arr = $ uploadedfile_mod-> getAll ("select file_type, file_path from 'ecm _ uploaded_file 'WHERE file_id IN ({$ file_str}) order by add_time DESC ");

If (! Empty ($ url_arr )){
Foreach ($ url_arr as $ v ){
If ($ v ['file _ type'] = 'image/gif '){
$ Url = $ v ['file _ path'];
Break;
Exit ();
} Else {
Unset ($ v );
}
}
}



// $ Url = $ uploadedfile_mod-> getOne ("select file_path from 'ecm _ uploaded_file 'WHERE file_id = {$ file_id} order by add_time DESC ");

If (! Empty ($ url )){
Echo $ url;
Exit ();
} Else {
Echo 0;
Exit ();
}
} Else {
Echo 0;
}
}