發表文章

目前顯示的是有「js」標籤的文章

用 js 寫區塊自適應,等比縮放

▼500是可以調整的數值,藍色數字調整不同比例視窗所呈現的區塊長寬 page3ContentResize();     $(window).resize(function() {         page3ContentResize();     });     function page3ContentResize(){//page3Contant區塊自適應         var page3_width = $('.page3').width(),             page3_height = $('.page3').height(),             page3Content_set_newwidth = 0,             page3Content_set_newheight = 0;         if(page3_width<page3_height+ 500 ){             // console.log('寬小於高')             page3Content_set_newWidth = page3_width/ 1.3 ;             page3Content_set_newHeight = page3_width/ 3.5 ;         }else{             // console.log('寬大於高')             pa...

niceScroll.js 搭配 boostrap 的 modal 組件 js 設定&改變滾動條樣式方法支援多瀏覽器

▼css部分可做以下設定 /* 设置滚动条的样式 */ .right_info::-webkit-scrollbar { width:12px; } /* 滚动槽 */ .right_info::-webkit-scrollbar-track { -webkit-box-shadow:inset006pxrgba(255,255,255,1); border-radius:10px; background:rgba(255,255,255,1); } /* 滚动条滑块 */ .right_info::-webkit-scrollbar-thumb { border-radius:10px; background:rgba(24,65,144) !important; -webkit-box-shadow:inset006pxrgba(0,0,0,0.5); } .right_info::-webkit-scrollbar-thumb:window-inactive { background:rgba(255,0,0,0.4); } /* 滚动条ie */ .right_info{   scrollbar-base-color: #ffffff;   scrollbar-face-color: #144190;   scrollbar-3dlight-color: #ffffff;   scrollbar-highlight-color: #ffffff;   scrollbar-track-color: #ffffff;   scrollbar-shadow-color: #ffffff;   scrollbar-dark-shadow-color: #ffffff; } ▼niceScroll.js可做以下設定 var explorer = window.navigator.userAgent;     if (explorer.indexOf("MSIE") >= 0) {//ie10及以下 ...

location.hash 屬性:設置或取得當前URL中的錨

範例: ▼設置錨點 (連結按了網頁不會重新整理) <a href="#story"> ▼js判斷錨點內容做動作 if(location.hash == "#story" || location.hash == "#character" || location.hash == "#background"){ $(".story_totalnav").addClass("active"); $(".navigation_2nd").fadeIn(500) }else{ $(".story_totalnav").removeClass("active"); $(".navigation_2nd").fadeOut(500) } if(location.hash == "#ost"){ $(".ost_area").addClass("active") }else{ $(".ost_area").removeClass("active") }

使陣列裡的數值隨機重新排序

.▼放置全域 var new_arr = [];//定義一個新陣列,作為產生亂數時存放用 . . . . . ▼function內 var arr = [1,2,3,4,1,2,3,4,1,2,3,4];       arr.sort(randomSort);        new_arr.push(arr);//塞入陣列裡 . . . . .▼取得隨機號碼給sort()重新排列 function randomSort(a, b) { return Math.random() > 0.5 ? -1 : 1; } . . . . .▼清空陣列 new_arr.length = 0;

js替數字左邊自動補0

//左邊自動補0 function paddingLeft(str,lenght){ if(str.length >= lenght) return str; else return paddingLeft("0" +str,lenght); }

javascript比對日期時間

var currDate = Date.parse(new Date()).valueOf(); //今天時間 var starttime = '2019/9/27 14:09:00'; //設定開始時間格式 var startDate = Date.parse(starttime).valueOf(); var endtime = '2019/10/17 23:59:00'; //設定結束時間格式 var endDate = Date.parse(endtime).valueOf(); if(currDate>startDate){//今天大於開始日             if(currDate>endDate){//今天大於結束日                 //投票已結束                 $('#voteOff').modal('show');             }else{                 //確認投票                 $('#butnSure'+this_butnSure).modal('show');             }         }else{             //投票尚未開啟             $('#voteNone').modal('show'); } p.s 凌晨12點為: 上午12:00:00