1. The picture scrolls with the scroll bar
Code:
var menuYloc = $("#right").offset().top; $(window).scroll(function () { var offsetTop = menuYloc + $(window).scrollTop() + "px"; $("#right").animate({ top: offsetTop }, { duration: 600, queue: false }); });
2. Hover the mouse over the picture to zoom in, move out the picture and change it back to the original size
Code:
// The picture to be suspended // Mouse the mouse into $(".book ul li img").mouseenter( function (){ var wValue=1.5 * $( this ).width(); var hValue=1.5 * $( this ) .height(); $(this).animate({width: wValue, height: hValue, left:("-"+(0.5 * $(this).width())/2), top:("-"+(0.5 * $( this ).height())/2)}, 1000); // mouse remove }).mouseleave( function (){ $(this).animate({width: "200", height: "200", left:"0px", top:"0px"}, 1000 ); });
3. Assign value to the Select option drop-down box (two levels of data)
figure 1:
figure 2:
Code:
var pro = ["Beijing","Tianjin","Shanghai","Chongqing","Hebei","Shanxi","Liaoning","Jilin","Heilongjiang","Jiangsu","Zhejiang","Anhui" ","Fujian","Jiangxi","Shandong","Henan","Hubei","Hunan","Guangdong","Hainan","Sichuan","Guizhou","Yunnan","Shaanxi", "Gansu", "Qinghai", "Inner Mongolia", "Guangxi", "Tibet", "Ningxia", "Xinjiang Uygur Autonomous Region", "Hong Kong", "Macau", "Taiwan" ]; varcity = {Beijing:["Dongcheng District","Xicheng District","Chongwen District","Xuanwu District","Chaoyang District","Haidian District","Fengtai District","Shijingshan District","Fangshan District" ,"Tongzhou District","Shunyi District","Changping District","Daxing District","Huairou District","Pinggu District","Mentougou District","Miyun County","Yanqing County"],Tianjin:[ "Heping District", "Hedong District", "Hexi District", "Nankai District", "Hebei District", "Hongqiao District", "Dongli District", "Xiqing District", "Beichen District", "Jinnan District" District","Wuqing District","Baodi District","Binhai New District","Jinghai County","Ninghe County","Ji County"],Shanghai:["Huangpu District","Luwan District","Xuhui District" District","Changning District","Jing'an District","Putuo District","Zhabei District","Hongkou District","Yangpu District","Minhang District","Baoshan District","Jiading District","Pudong District" New District", "Jinshan District", "Songjiang District", "Qingpu District", "Fengxian District", "Chongming County"],Chongqing: ["Yuzhong District", "Dadukou District", "Jiangbei District", "Nan'an District", "Beibei District", "Yubei District", "Banan District", "Changshou District", "Shuangqiao District" ","Shapingba District","Wansheng District","Wanzhou District","Fuling District","Qianjiang District","Yongchuan District","Hechuan District","Jianjin District","Jiulongpo District"," Nanchuan District","Qijiang County","Tongnan County","Rongchang County","Bishan County","Dazu County","Tongliang County","Liangping County","Kai County","Zhong County" ,"Chengkou County","Dianjiang County","Wulong County","Fengdu County","Fengjie County","Yunyang County","Wuxi County","Wushan County","Stone Pillar Soil" Family Autonomous County", "Xiushan Tujia and Miao Autonomous County", "Youyang Tujia and Miao Autonomous County", "Pengshui Miao and Tujia Autonomous County"], Hebei: ["Shijiazhuang", "Tangshan", "Qinhuangdao", "Handan", "Xingtai", "Baoding", "Zhangjiakou", "Chengde", "Cangzhou", "Langfang", "Hengshui"], Shanxi: ["Taiyuan","Datong","Yangquan","Changzhi","Jincheng","Suozhou","Jinzhong","Yuncheng","Xinzhou","Linfen","Luliang"],Liaoning:[" Shenyang","Dalian","Anshan","Fushun","Benxi","Dandong","Jinzhou","Yingkou","Fuxin","Liaoyang","Panjin","Tieling","Chaoyang" ,"Huludao"], Jilin: ["Changchun","Jilin","Siping","Liaoyuan","Tonghua","Baishan","Songyuan","Baicheng","Yanbian Korean Autonomous Prefecture"], Heilongjiang: ["Harbin","Qiqihar","Hegang","Shuangya Mountain","Jixi","Daqing","Yichun","Mudanjiang","Jiamusi","Qitaihe","Heihe" ,"Suihua","Great Xing'anling"],Jiangsu:["Nanjing","Suzhou","Wuxi","Changzhou","Zhenjiang","Nantong","Taizhou","Yangzhou","Yancheng", "Lianyungang", "Xuzhou", "Huai'an", "Suqian"], Zhejiang: ["Hangzhou", "Ningbo", "Wenzhou", "Jiaxing", "Huzhou", "Shaoxing", "Jinhua" ","Quzhou","Zhoushan","Taizhou","Lishui"],Anhui:["Hefei","Wuhu","Bengbu","Huinan","Ma'anshan","Huibei","Tongling", "Anqing", "Huangshan", "Chuzhou", "Fuyang", "Suzhou", "Chaohu", "Lu'an", "Bozhou", "Chizhou", "Xuancheng"], Fujian: ["Fuzhou", "Xiamen", "Putian", "Sanming", "Quanzhou", "Zhangzhou", "Nanping", "Longyan", "Ningde"], Jiangxi: ["Nanchang", "Jingdezhen", "Pingxiang", "Jiujiang" ","Xinyu","Yingtan","Ganzhou","Jian","Yichun","Fuzhou","Shangrao"],Shandong:["Jinan","Qingdao","Zibo","Zaozhuang","Dongying","Yantai","Weifang","Jining","Taian","Weihai","Rizhao","Laiwu","Linyi","Dezhou","Liaocheng" ,"Binzhou","Heze"],Henan:["Zhengzhou","Kaifeng","Luoyang","Pingdingshan","Anyang","Hebi","Xinxiang","Jiaozuo","Puyang"," Xuchang", "Luohe", "Sanmenxia", "Nanyang", "Shangqiu", "Xinyang", "Zhoukou", "Zumadian"], Hubei: ["Wuhan", "Huangshi", "Shiyan", "Jingzhou" ,"Yichang","Xiangfan","Ezhou","Jingmen","Xiaogan","Huanggang","Xianning","Suizhou","Enshi"],Hunan:["Changsha","Zhuzhou"," Xiangtan","Hengyang","Shaoyang","Yueyang","Changde","Zhangjiajie","Yiyang","Chenzhou","Yongzhou","Huaihua","Loudi","Xiangxi"],Guangdong:["Guangzhou","Shenzhen","Zhuhai","Shantou","Shaoguan","Foshan","Jiangmen","Zhanjiang","Maoming" ,"Zhaoqing","Huizhou","Meizhou","Shantui","Heyuan","Yangjiang","Qingyuan","Dongguan","Zhongshan","Chaozhou","Jieyang","Yunfu"], Hainan: ["Haikou", "Sanya"], Sichuan: ["Chengdu", "Zigong", "Panzhihua", "Luzhou", "Deyang", "Mianyang", "Guangyuan", "Suining", "Neijiang" ,"Leshan","Nanchong","Meishan","Yibin","Guang'an","Dazhou","Ya'an","Bazhong","Ziyang","Aba","Ganzi","Liangshan"] , Guizhou: ["Guiyang", "Liupanshui", "Zunyi", "Anshun", "Tongren", "Bijie", "Southwest Guizhou", "Southeast Guizhou", "Southern Guizhou"],Yunnan: ["Kunming", "Qujing", "Yuxi", "Baoshan", "Zhaotong", "Lijiang", "Pu'er", "Lincang", "Dehong", "Nujiang", "Diqing", "Dali", "Chuxiong", "Red River", "Wenshan", "Xishuangbanna"], Shaanxi: ["Xi'an", "Tongchuan", "Baoji", "Xianyang", "Weinan", "Yan'an", "Hanzhong" ","Yulin","Ankang","Shangluo"],Gansu:["Lanzhou","Jiayuguan","Jinchang","Baiyin","Tianshui","Wuwei","Jiuquan","Zhangye", "Qingyang", "Pingliang", "Dingxi", "Longnan", "Linxia", "Gannan"], Qinghai: ["Xining", "Haidong", "Haibei", "Hainan", "Huangnan" , "Guoluo", "Yushu", "Haixi"], Inner Mongolia: ["Hohhot", "Baotou", "Wuhai", "Chifeng", "Tongliao", "Ordos", "Hulunbuir","Bayannaoer", "Ulanqab", "Xilin Gol League", "Xing'an League", "Alxa League"], Guangxi: ["Nanning", "Liuzhou", "Guilin", "Wuzhou", " Beihai","Fangchenggang","Qinzhou","Guigang","Yulin","Baise","Hezhou","Hechi","Laibin","Chongzuo"],Tibet:["Lhasa","Naqu" ","Qamdo","Lyingzhi","Shannan","Shigaze","Ali"],Ningxia:["Yinchuan","Shizuishan","Wuzhong","Guyuan","Zhongwei"],Xinjiang Uygur Autonomous Region :["Urumqi","Kelamayi","Turpan","Hami","Hotian","Akesu","Kashi","Kizilsu","Bayingoleng","Changji","Bo Altala","Ili","Tacheng","Altai"],Hong Kong:["Hong Kong Island","Kowloon East","Kowloon West","New Territories East","New Territories West"],Macau: ["Macau Peninsula","Outlying Islands"],Taiwan:["Taipei","Kaohsiung","Keelung","Hsinchu","Taichung","Chiayi","Tainan"]}; // Add data to the location (Figure 1) for ( var i=0;i<pro.length;i++ ){ $option=$("<option/>"); $option.attr("value",pro[i]); $option.text(pro[i]); $("#province").append($option); } // Cities appear in the selected area (Figure 2) $("#province").click( function (){ var cities=city[$( this ).val()]; $(this).parent().parent().find("#city").empty(); for(var i=0;i<citys.length;i++){ $option=$("<option/>"); $option.attr("value",citys[i]); $option.text(citys[i]); $(this).parent().parent().find("#city").append($option); } })