文章

解決mouseenter及mouseleave執行物件動畫未完成又重複觸發的問題-教學撰寫:徐嘉裕Neil hsu

圖片
如果要用jQuery的mouseenter(滑鼠滑入)及mouseleave(滑鼠滑出)來執行物件動畫,會遇到一個問題,假使mouseenter時物件因該要跑到left:80px的位置才算動畫完成,mouseenter則回到left:0px的位置,但在動畫未執行完成user又快速的在執行區塊滑入滑出,就會變成動畫亂跳的情況!!
舉例來說,像下面這張圖三個物件是尚未mouseenter觸發前的狀態


滑鼠滑入其中一個按鈕會觸發mouseenter動畫事件,物件往左上移動


滑鼠滑出執行區會觸發mouseleave動畫事件,物件往右下移動,返回原本位置



js-code應該是這樣
//mouseenter $("body").on("mouseenter", "#indexblocksbox01", function (){
$(this).css("cursor", "pointer");
$(this).css({"animation-name":"indexbox1","animation-duration":"0.4s","left":"160px","top":"53px"});
$("#title01btn").css({"animation-name":"indexbox2","animation-duration":"0.4s","background-color":"#FFFFFF","color":"#E77C00"});
})

//mouseleave
$("body").on("mouseleave", " #indexblocksbox01", function (){
$(this).css("cursor", "auto"…

php遞迴刪除資料夾及資料夾內容function->Xoops-教學撰寫:徐嘉裕Neil hsu

如果用PHP函數刪除目錄若目錄中有檔案,則會刪除失敗,使用rmdir()也只能刪空目錄,有資料的目錄是無法刪除,所以必須要先用程式吧目錄內的檔案全部刪除,最後再刪除目錄,這裡分享一個好用的遞迴刪除目錄及目錄內容的function,另外還加上了若刪除失敗則更改目錄檔名的function,兩個一起使用就沒問題了,CODE如下:
1、吧以下兩個function貼到Xoops模組的function.php裡面
//變更資料夾檔名
function changedirectory($changedate) {
$date=date("Ymd");
if(!empty(rename($changedate, $changedate."_bak_{$date}"))) return true;
}

//刪除目錄包含內容物件
function fileunlink_r($from) {
if (!file_exists($from)) {return false;}
$dir = opendir($from);
while (false !== ($file = readdir($dir))) {
if ($file == '.' OR $file == '..') {continue;}
if (is_dir($from . DIRECTORY_SEPARATOR . $file)) {
fileunlink_r($from . DIRECTORY_SEPARATOR . $file);
}
else {
unlink($from . DIRECTORY_SEPARATOR . $file);
}
}
if(!empty(rmdir($from))) $returnvar=true;
closedir($dir);
return $returnvar;
}

2、在執行刪除的php上引入這兩支php函式
//刪除資料夾及底下資料($from為刪除檔案目錄的實體路徑) $Filevar=fileunlink_r($from=XOOPS_ROOT_PATH.&#…

升級upload 0.34的方法class.upload.php-教學撰寫:徐嘉裕Neil hsu

圖片
class.upload.php是一套超好用的PHP上傳檔案套件程式,能上傳圖檔及檔案,也能多檔上傳,本次心得記錄主要以舊版的class.upload.php升級到class.upload.php0.34版的修改紀錄為主,若要查詢class.upload.php如何使用可以去Google一下有很多教學喔!
首先去verot官網下載class.upload.php套件回來,選擇最新的0.34版
網址:https://www.verot.net/home.htm

下載回來後解壓縮,吧class.upload.php-master\class.upload.php-master\src  <-資料夾裡面的
->class.upload.php ->lang
複製起來,貼到您網站或模組原本放置class.upload.php檔案的目錄位置覆蓋舊檔
然後在網站或模組找到引入class.upload.php程式上傳檔案function的地方(上傳參數設定那),裡面有一個類別為
$pic = new Upload($_FILES['upfile'], 'zh_TW');
全部替換為
$pic = new \Verot\Upload\Upload($_FILES['upfile']);
這樣就完成upload 0.34的升級了,經測試原本中文檔名會上傳失敗的問題在upload 0.34都排除了,而且支援php7.3,真的非常好用,有需要的朋友參考看看!

工作心得撰寫:徐嘉裕 Neil hsu

Xoops免費佈景:neilambilight2.92正式版釋出-佈景設計開發:徐嘉裕Neil hsu

圖片
原本預計本次更新要翻新neilambilight佈景的前端介面,包括視差設計滾動設計等,但發現neothemesadmin模組仍有許多功能需要強化及升級,否則光改介面也沒什麼意義,所以本次發佈的neilambilight2.92仍以功能優化擴充與升級為主,包括表單防機器人AJAX機制做了強化處理(能100%阻絕機器人垃圾留言),PHP版本升級到PHP7.3.15,資料庫兼容升級到10.4.8-MariaDB嚴格模式,另外新增加了布景主選單及區塊選單的群組權限顯示功能(包含底層所有選單),以及對xlanguage多國語言模組兼容化工作,新增加一個關於我們圖文區塊,針對電腦版及手機版CSS及JS功能做優化調整處理,neilambilight2.92可以在最新版的Xoops2.5.10運行,也能兼容到Xoops2.5.8,包括tad最新釋出的模組全部都有做兼容測試,符合各種環境與不同版本的運行需求,歡迎下載安裝使用。
Xoops免費佈景-Neil佈景測試站 http://demoweb.neodw.com/themesdemo/



neilambilight2.92 更新內容
==============================
1、修正neothemesadmin佈景管理模組PHP常數重複問題。 2、修正neothemesadmin佈景管理模組跑馬燈左右移動無法正常顯示問題。 3、修正neillibrary函數庫模組XOOPS_LICENSE_KEY定義錯誤問題。 4、會員註冊表單增加【AJAX選擇時間驗證】防機器人功能,可阻斷100%的機器人表單註冊。 5、neillibrary函數庫模組新增加刪除IP紀錄及封鎖天數自動化功能。 6、聯絡我們表單增加【AJAX選擇時間驗證】防機器人功能,可阻斷100%的機器人表單註冊。 7、聯絡我們區塊表單增加【AJAX選擇時間驗證】防機器人功能,可阻斷100%的機器人表單註冊。 8、修改資料表語法兼容10.4.8-MariaDB嚴格模式。 9、PHP7.3.15兼容升級。 10、onUpdate.php新增資料表增加10.4.8-MariaDB嚴格模式。 11、區塊選單管理後臺套用網站選單的階層樣式跟開啟效果。 12、優化佈景管理模組->網站選單跟區塊選單UI介面。 13、修改隨機小語ICON貼入格式。 14、neothemesadmin佈景管理模組後台…

JQuery Tabs Generator頁籤修改範例(PHP端及JS優化修改)-教學撰寫:徐嘉裕Neil hsu

圖片
JQuery Tabs Generator是一個好用的頁籤生成器,輸入內容就能產生頁籤,大家可以點以下的網址自己試看看

https://www.html-code-generator.com/jquery/tabs-generator.php

不過如果要修改成用PHP迴圈輸出smarty樣板就還需要再做些修改,才能靈活實用美觀大方,像是下面這樣:


修改過後頁籤可隨資料自動增加跟刪減,如果只有一個頁籤也能正常顯示內容



以下為修改過的全部程式codo範例

php端-code

$descriptionArr = array(); //建構陣列 $i=0; $descriptionArr[$i]['btntext']=_MD_SHOPWCASE20;  //按鈕文字 $descriptionArr[$i]['btncenter']=$productlimt['description'];  //頁籤內容 $descriptionArr[$i]['i']=$i;  //頁籤id $i++; $descriptionArr[$i]['btntext']=_MD_SHOPWCASE22;  //按鈕文字 $descriptionArr[$i]['btncenter']=$productlimt['specification'];  //頁籤內容 $descriptionArr[$i]['i']=$i;  //頁籤id $i++; $descriptionArr[$i]['btntext']=_MD_SHOPWCASE23;  //按鈕文字 $descriptionArr[$i]['btncenter']=$productlimt['productwarranty'];  //頁籤內容 $descriptionArr[$i]['i']=$i;  //頁籤id
$shopwcase['descriptionbox']=$descriptionArr;
輸出smarty $xoopsTpl->assign( "shopwcasepage" , $shopwc…

Xoops模組開發->使用xlanguage3.1RC多國語言模組配合的程式修改-教學撰寫:徐嘉裕Neil hsu

圖片
xlanguage是一套可以切換Xoops語言的模組,也能透過語言標籤來切換語言內容,以達成網站多國語言的目的,xlanguage3.1RC可以完全兼容Xoops2.5.10,而且也已經被Xoops官網收錄於官方模組中,直接安裝起來用能使用了,我已經吧xlanguage模組中文化完成了,有需要的朋友可以點以下連結下載。

xlanguage3.1RC中文化下載

https://drive.google.com/file/d/1Wz8tcHLE-xtM8vwa0_NfVAyH8Xjewwv2/view?usp=sharing


雖然說安裝起來並設定好語言開啟區塊就能使用



但經過實際測試,還是有很多問題需要在其他模組寫程式套件來配合運作,才能達到100%完美應用,否則使用上還是很多不便利的地方,以下為修改模組紀錄彙整。

1、xlanguage的語言切換作用機制主要有兩段,一部分是吧user選擇的語言儲存到setcookie裡面在讀取對應的模組語言包,這部分可以切換UI的語言,另一部分則是資料字段的轉換,例如

[tw]這是中文標題[/tw][en]This is the Chinese title[/en]

所以如果選擇中文顯示[tw]這是中文標題[/tw]中字段,選擇英文則顯示[en]This is the Chinese title[/en],語言標籤會被去掉,但這作用並不是在sql資料導出時做字段判斷,而是用伺服器頂層的Java吧所有PHP輸出的變數都掃過一次比對後擷取語言標籤內容,好處是不用在模組資料輸出去做字串擷取所有的模組都能使用,但會產生一個問題,如果不是輸出頁面的變數,像是幕後傳參寄發E-mail,就無法做語言判斷,反而會吧全部字串都給輸出,像是這樣


收到通知信的人大概也一頭霧水吧,什麼碗糕?解決辦法就是另外寫一個資料轉換function給幕後讀取資料時使用,code如下:

◎吧xlanguagePlugin()放到function.php裡面

//取得指定模組module資料表值
function modulesmidvar($modulesid="",$var=""){
$modulevar=empty($var) ? 'mid' : $var; // get TRUE
$module_handler …

masonry+imagesloaded+AJAX瀑布流套件整合用法-教學撰寫:徐嘉裕Neil hsu

之前寫過一篇【Bootstrap3瀑布流排版用JS套件-Masonry-教學】
https://neohsuxoops.blogspot.com/2019/08/bootstrap3js-masonry.html

不過這方法只能用在已讀出的資料樣板排版上,例如PHP讀出50筆,然後可以用這個方法來做瀑布流排版,但如果要應用在AJAX上則需要再做修改才能應用。

例如像pinterest網站,預設資料只出現幾筆,然後瀏覽器卷軸到底之後又會出現資料,一直循環開啟到資料全部讀完,以AJAX非同步方式求取資料的瀑布流效果。

AJAX結構跟運作原理就不多說了,這裡直接是masonry套件+imagesloaded套件在AJAX中的應用方式,CODE如下。

1、先在樣板裡面引入三支檔

<script src="http://desandro.github.io/imagesloaded/imagesloaded.pkgd.min.js"></script>
<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>
<script src="js/masonryajaxjs.js"></script> //此為呼叫AJAX的JS檔需自行建立

2、在樣板上貼上以下的function,放在三個引入檔的下方
<script> function masonryfunction(){ $('.masonry').imagesLoaded(function() { var msnry = new Masonry(".masonry",{  itemSelector: '.item', columnWidth: <{$enshow.columnWidth}>, //單個物件寬度 gutter: <{$enshow.gutter}>,   //物件邊距 isFitWidth: true }); 
//物件觸發後10毫秒執行一次後終止 setTimeout(function()…

寫一個PHP同條件查詢刪除多個資料表內容的批次刪除function-教學撰寫:徐嘉裕Neil hsu

假設一共有四個資料表有關聯資料,其中一個為主表資料刪除同時連同另外三個資料表中的資料也一起刪除,如果按正常的寫法是

寫一個單獨刪除主表欄位的SQL語法

再寫三個刪除關聯資料的foreach抓出資料後迴圈刪除SQL語法

這樣程式又變得很龐大,所以寫了一個批次刪除的function一次就能吧相同查詢條件的資料全部刪除,這樣程式也精簡很多看了也舒服。

方法如下

1、先在function.php中加上以下的function

//引入共用函數
include_once XOOPS_ROOT_PATH."/modules/neillibrary/function.php";

//批次刪除function
function deleteArr($Arrdate=""){
foreach($Arrdate as $key=> $val){
$dbneme=$Arrdate[$key]['dbneme'];
$where=$Arrdate[$key]['where'];
$deleteArr=databasetablewhile($dbneme,$where);
foreach($deleteArr as $k=> $val){
$where=" where `".$Arrdate[$key]['id']."` = '".$deleteArr[$k][$Arrdate[$key]['id']]."'";
$DBname=$Arrdate[$key]['dbneme'];
deletefunction($where,$DBname);
} }
}

2、然後在要刪除資料的PHP用陣列輸入刪除的查詢項目
$Arrdate = array(); //建構陣列 
//相同where查詢欄位 $whereDB=" where `basid` = '$dbid'"; //刪英資單位 $i=0; $Arrdate[$i]['dbneme']="neilbasicinformation"; //資料表名稱 $Arrd…

CentOS7啟用ssh的設定方法-教學撰寫:徐嘉裕Neil hsu

安裝好CentOS7後可以在圖形化介面中點選右鍵->開啟服務器修改設定後啟用SSH設定,方法如下:

1、先安裝openssh套件
sudo yum install openssh*

2、用gedit開啟sshd_config編輯(不要用vi很難編輯的)
sudo gedit /etc/ssh/sshd_config

3、增加可連線SSH帳號
AllowUsers admin (此欄位需要自行新增)

4、修改PORT吧#註解拿掉(可以改成8022PORT或其他PORT都可以)
Port 22

搜尋PermitRootLogin吧#註解拿掉
PermitRootLogin no

再來把這兩行的#註解拿掉
PermitEmptyPasswords no
PasswordAuthentication yes
搜尋Protocol設定使用SSHv2連線 Protocol 2

sudo systemctl restart sshd.service    重新啟動service

sudo systemctl enable sshd.service    設定開機啟動SSH

sudo semanage port -a -t ssh_port_t -p tcp 22      防火牆允許22 PORT



sudo firewall-cmd --permanent --zone=public --add-port=22/tcp

重新載入防火牆設定
sudo firewall-cmd --reload

sudo  netstat -ant | grep :22 查看 22PORT

查詢現在SELinux設定清單中的SSH服務有哪些Port
sudo semanage port -l | grep ssh
ssh_port_t tcp 8022, 22

怎麼測試?
格式:登入帳號@IP或主機名稱
指令:-p SSH服務Port號

sudo ssh -p 22 admin@192.168.1.100
如設定的Port在清單中,那就表示SSH設定完成防火牆也開啟列外了,之後再用遠端的PuTTY輸入 IP/Port 連線,然後輸入 帳號/密碼,就能用SSH連線進入主機了,

在透過 SSH 連線目標主機時,如果是第一次連線,會出現以下訊息,詢問是否要繼續連線:
The authenticity o…

解決CentOS Linux release 8.1.1911 安裝LAMPP缺少32 bit compatibility library套件而無法啟用問題!-教學撰寫:徐嘉裕Neil hsu

CentOS Linux release 8.1.1911是運行64位元,如安裝Lampp最新版xampp-linux-x64-7.3.14-0雖然也是64 Bit,但安裝套件還是32位元的,如果CentOS在安裝時沒有安裝32 bit compatibility library套件啟用lampp就會顯示

XAMPP is currently only availably as 32 bit application. Please use a 32 bit compatibility library for your system.

而無法啟用lampp,解決方法就是安裝CentOS 的glibc* libstd* ld-linux.so.2的套件包

輸入以下指令

1. 安裝glibc* libstd* ld-linux.so.2
yum -y install glibc* libstd* ld-linux.so.2

2. 啟動lampp
/opt/lampp/lampp start
經過實際測試原本無法啟動的lampp在安裝glibc* libstd* ld-linux.so.2之後就能正常啟動了
Starting XAMPP for Linux 7.3.14-0... XAMPP: Starting Apache...ok. XAMPP: Starting MySQL...ok. XAMPP: Starting ProFTPD...ok.
頭痛的問題終於解決了,真的的關關難過關關過,做IT產業的人真的會短命阿
有需要人朋友參考看看吧
參考資料來源:http://lekshmideepu.blogspot.com/2013/04/xampp-is-currently-only-available-as-32.html
教學撰寫:徐嘉裕Neil hsu