2009年12月1日 星期二

pchome 一日遊台北 js

自製黑幕背景...

$(function(){
$(window).scroll(resscrEvt);
$(window).resize(resscrEvt);
$(".clsw,#fullBg").click(closeWin);
});
function showWin(w,h,i,type){
$('#sel_pic').val(i);
var body_obj = get_body();
$("#fullBg").css({width:body_obj.w,height:body_obj.h+document.documentElement.scrollTop,display:"block"});
var objWH=objValue("msg");
var tbT=objWH.split("|")[0]+"px";
var tbL=objWH.split("|")[1]+"px";
if (type == 'prview') {
privew();
$("#prview").css({top:tbT,left:tbL}).fadeIn("slow");
$("#prview").height(h);
$("#prview").width(w);
}else {
$("#msg").height(h);
$("#msg").width(w);
$('#pic_text').val($('#text'+i).html());
$("#msg").css({top:tbT,left:tbL}).fadeIn("slow");
}

}
function objValue(obj){
var body_obj = get_body();
var st=document.documentElement.scrollTop;
var sl=document.documentElement.scrollLeft;
var objH=$("#"+obj).height();
var objW=$("#"+obj).width();
var objT=Number(st)+(Number(body_obj.h)-Number(objH))/2;
var objL=Number(sl)+(Number(body_obj.w)-Number(objW))/2;
return objT+"|"+objL;
}
function resscrEvt(){
var body_obj = get_body();
var bjCss=$("#fullBg").css("display");
if(bjCss=="block"){
$("#fullBg").css({width:body_obj.w,height:body_obj.h+document.documentElement.scrollTop});
//var objV=objValue("msg");
//var tbT=objV.split("|")[0]+"px";
//var tbL=objV.split("|")[1]+"px";
//$("#msg").css({top:tbT,left:tbL});
}
}
function get_body(){
var ch,cw;
if (self.innerHeight) {
cw=self.innerWidth;
ch=self.innerHeight;
}else if (document.documentElement&&document.documentElement.clientHeight) {
cw=document.documentElement.clientWidth;
ch=document.documentElement.clientHeight;
} else if (document.body) {
cw=document.body.clientWidth;
ch=document.body.clientHeight;
}
return {w:cw,h:ch};
}
function closeWin(){
$("#fullBg").hide();
$("#msg").hide();
$("#prview").hide();
}

function check(){
var i = $('#if').contents();
if ( i.find('.ra:checked').length == 0 && i.find('#url').length == 0 ) {
alert('您沒有選擇圖片!');
return ;
}else {
if ($('#pic_text').val() == '') {
alert('請輸入圖片文字描述!');
$("#pic_text").focus();
return ;
}
var v = $('#sel_pic').val();
var img= i.find('.ra:checked').val();
var h = '<div class="pic0'+v+'"><input type="submit" name="button" id="button" value="修改" class="fix" onclick="showWin(650,400,'+v+')"/><img src="'+img+'set" width="90" height="90" /></div>';
$('#s'+v).html(h);
$('#img'+v).html(img);
$('#text'+v).html($('#pic_text').val());
$('#pic_text').val('');
closeWin();
}
}
function privew(){
var h = '';
for (i=1 ;i<=6 ;i++){
var img = $('#img'+i).html();
var text = $('#text'+i).html();
if (img != '') {
h+= '<img src="'+img+'" /><br>';
}
if (text != '') {
h+= '<div>'+text+'</div><br>';
}
}
$("#prview_data").html(h);
}

function ch_status(){
var h = '';
var j =0 ;
for (i=1 ;i<=6 ;i++){
var img = $('#img'+i).html();
if (img != '') $j++
}
return j ;
}

function get_data(action, k ){
var h1 ='';
var h2 ='';
var ck = 0;
j=0;
for (i=1 ;i<=6 ;i++){
var img = $('#img'+i).html();
var text = encodeURIComponent($('#text'+i).html());
if (img.length > 0 ) j++;
h1 += '<'+img;
h2 += '<'+text;
}
if ($('#name').val() == '') {
alert ('請填寫此路線名稱!!');
$("#name").focus();
return;
}
if (j >= 6 ){
if(confirm("您目前已經完成此次路線的所有圖片。\n是否確定完成?\n\n(ps:「確定完成」後將不能再修改!)\n\n"))
action = 'save_ok';
}
if (j == 0 ) {
alert('您沒有選擇任何圖片!!');
return;
}

if ($('#ck:checked').length > 0 ) ck = 1 ;

var h = $('#name').val()+'>'+h1.substr(1)+'>'+h2.substr(1)+'>'+ck;
$.ajax({
type: "POST",
url: '/act/ajax/run.php',
data: {act:action ,key:h},
dataType :"json",
success: function(res){
if (res.status == 2) {
location.href = "mypath.html";
}else {
if (res.msg) alert(res.msg);
}
}
});
}

.fullBg {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#000000 none repeat scroll 0 0;
display:none;
font-size:0;
height:100%;
left:0;
opacity:0.5;
position:absolute;
top:0;
width:100%;
z-index:100;
}

【下列文章您可能也有興趣】

沒有留言: