csrf codeigniter 4/3 ajax 比較佳的解決方案
閱讀全文〈[轉貼]csrf codeigniter 4/3 ajax〉
分類: 網頁設計
[轉貼]使用js jquery 寫評價星級
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
</head>
<style type="text/css">
.stars{
white-space: nowrap;
text-align: center;
margin-top: 20px;
margin-bottom: 20px;
}
.stars li{
display: inline-block;
color: #ADADAD;
font-size: 40px;
}
</style>
<body>
<ul class="stars">
<li>★</li>
<li>★</li>
<li>★</li>
<li>★</li>
<li>★</li>
</ul>
<script src="../../js/common/jquery-git.js"></script>
<script>
$(function() {
//为星星设置hover效果
var isClicked = false;
var beforeClickedIndex = -1;
var clickNum = 0; //点击同一颗星次数
$('li').hover(
function() {
if(!isClicked) {
$(this).css('color', '#F0AD4E');
var index = $(this).index();
for(var i = 0; i <= index; i++) {
$('li:nth-child(' + i + ')').css('color', '#F0AD4E');
}
}
},
function() {
if(!isClicked) {
$('li').css('color', '#ADADAD');
}
}
);
//星星点击事件
$('li').click(function() {
$('li').css('color', '#ADADAD');
isClicked = true;
var index = $(this).index();
for(var i = 1; i <= index+1; i++) {
$('li:nth-child(' + i + ')').css('color', '#F0AD4E');
}
if(index == beforeClickedIndex) { //两次点击同一颗星星 该星星颜色变化
clickNum++;
if(clickNum % 2 == 1) {
$('li:nth-child(' + (index + 1) + ')').css('color', '#ADADAD');
} else {
$('li:nth-child(' + (index + 1) + ')').css('color', '#F0AD4E');
}
} else {
clickNum = 0;
beforeClickedIndex = index;
}
});
});
</script>
</body>
</html>
js写评价的星星，版权声明：本文为博主原创文章，遵循CC4.0by-sa版权协议，转载请附上原文出处链接和本声明。刚开始接触写星星评价时，哇！估计脑子刚被驴踢了，竟然想到了最笨的办法-手工画五角星。妈呀！css样式都写了好大一串，还沾沾自喜终于画出来了，然后瞅一瞅旁边的妹子写得怎么样了，哇！人家机智的！直接用符号★就解决了！！！唉，智商捉急呀！先上图看看吧：虽然简单，还是有几个注意的地方：1.未点
使用 Bootstrap 3/Bootstrap 4 顯示/隱藏 HTML 元素
| BS3 | BS4 |
| visible-xs | d-block d-sm-none |
| visible-sm | d-none d-sm-block d-md-none |
| visible-md | d-none d-md-block d-lg-none |
| visible-lg | d-none d-lg-block d-xl-none |
| visible-xl | d-none d-xl-block |
| hidden-xs | d-none d-sm-bloc |
| hidden-sm | d-block d-sm-none d-md-block |
| hidden-md | d-block d-md-none d-lg-block |
| hidden-lg | d-block d-lg-none d-xl-block |
| hidden-xl | d-block d-xl-none |
| BS4 | |
| d-none d-sm-block | |
| d-none d-md-block | |
| d-none d-lg-block | |
| d-none d-xl-block | |
| d-none | |
| d-sm-none | |
| d-md-none | |
| d-lg-none | |
| d-xl-none |
使用 Bootstrap 4 顯示/隱藏 HTML 元素
工作效率提升 – 使用 google 試算表 結合 chatGPT生產大量文案 結合 FB API 自動發佈文章排程
這篇文章比較硬一些 主要是因為會需要動手與了解程式運作 但整體能不去操作 可怕的FB排程發文介面已經很感動不已 因為在大量排文章時 絕對能理解有多痛苦
使用這工具教學 最大的好處在於 效率的提升 只是想要把資料 發出去 卻想不到 該怎麼做些引詞 這時候 就是 chatGPT的強項 透過 API的方式 讓其運作 效率驚人(20美金網頁版的 還要等他慢慢跑 但 這API版本 甚至是10幾條一起同步運作)
閱讀全文〈工作效率提升 – 使用 google 試算表 結合 chatGPT生產大量文案 結合 FB API 自動發佈文章排程〉
Base64String 圖像在 fancybox 打開
<a href="#myBase64String" class="fancybox" rel="group"> <img src="data:image/jpg;base64,@Convert.ToBase64String(Model.Image)" alt="" id="myBase64String" /> </a>
$('[data-fancybox="images"]').fancybox({
beforeLoad : function(instance, current) {
if (current.src=== '#') {
current.src = current.opts.$orig.find('img').attr('src');
}
}
});
內容出處: jquery – Fancybox Base64String image disappears when fancybox opens – Stack Overflow
[轉貼]清除 LINE 快取，強制重新抓取分享連結縮圖與文字
[轉貼]Vectorizer.AI – 將你的圖片轉為向量檔，可無限放大變超清晰
阿湯哥 介紹的這個工具 感覺真的利害威猛了 快點記錄下來 分享給大家
Vectorizer.AI – 將你的圖片轉為向量檔，可無限放大變超清晰
內容出處: Vectorizer.AI – 將你的圖片轉為向量檔，可無限放大變超清晰 | 就是教不落 – 給你最豐富的 3C 資訊、教學網站
[轉貼]如何讓 ChatGPT 產生「圖文並茂」的內容？ | 就是教不落 – 給你最豐富的 3C 資訊、教學網站
比如像這樣，在要顯示圖片時，只要加入以下指令即可：
顯示圖片請透過 markdown 語法 (https://source.unsplash.com/960x640/?<關鍵詞>)
你看，這樣就可以搭配圖片顯示了，雖然不見得全部的圖片都會搭配的很好，但也有個七、八成，你再依需求去修改調整就好。
很多人在使用 ChatGPT 時，以為他就是單純的文字聊天機器人，但其實只是我們沒有用對方式來讓他可以顯示圖片
[轉貼]Bootstrap Studio 全視覺化Bootatrap編輯器，並支援手動修改HTML、CSS、JS檔
[轉貼]從手繪 Wireframe 自動生成 HTML 程式碼
[Bootstrap 3] 格狀系統 Grid System
其中xs代表裝置寬度小於768px(手機裝置)，
sm代表大於768px且小於992px(平板)，
md代表大於992px且小於1200px(筆電)，
lg代表大於1200px(外接螢幕,桌機)。
其中xs代表裝置寬度小魚768px(手機裝置)，sm代表大於768px且小於992px(平板)，md代表大於992px且小於1200px(筆電)，lg代表大於1200px(外接螢幕)。
[轉貼]WordPress 後台 wp-admin 無限循環 https 302重定向 或 cloudflare 無限循環 301 的解决方法
wp-config.php 增加
$_SERVER['HTTPS'] = 'on';
define('FORCE_SSL_LOGIN', true);
define('FORCE_SSL_ADMIN', true);
[轉貼]【2021】Woocommerce 教學，不懂程式照樣自架電商網站 | WebLai
WP + Woocommerce 購物車 製作方式
你想架設一個品牌電商網站，但卻不知如何開始嗎？沒有足夠的預算請工程師架設，想要嘗試自己架看看嗎？這篇文章，主要是幫助那些跟我以前一樣，完全不懂程式碼的網路新手，透過 WordPress 上的 Woocommerce 電子商務外掛系統，來架出一個屬於自己的品牌電商網站。
[轉貼]想在中國大陸擁有一個網站，你需要知道
[轉貼][jQuery] .parent() 與 .parents() 與 .closest() 的差異
<div class="selected"> 123 <div class="selected"> <div> Hello Again </div> </div> </div>
[轉貼]清除 LINE 快取，強制重新抓取分享連結縮圖與文字
sketchup 醒吾技術學院
使用遠端的 Git 主機 部屬到 Plesk
TortoiseGit 使用 github 配合 plesk
[email protected]:[帳號]/[庫]
使用 ssh-key 做驗證
速度上 真的非常快速 比我上 FTP還要快 真的是發現新世界
內容出處: 使用遠端的 Git 主機 | Plesk Onyx documentation
參考資料: https://support.plesk.com/hc/en-us/articles/115002247654-Is-it-possible-to-connect-to-private-Github-repositories-using-Plesk-Git-extension-
範例 Namespaces 命名空間 與 Class Autoloading 自動加載
範例 Namespaces 命名空間 與 Class Autoloading 自動加載
[轉貼]WordPress 網域 搬家 網址異動 更新資料庫
wp 網站搬家 需要更新資料庫
UPDATE wp_options SET option_value = REPLACE(option_value, '舊網址', '新網址') -- 僅替換與網站相關的條件 WHERE option_name = 'home' OR option_name = 'siteurl'; UPDATE wp_postmeta SET meta_value = REPLACE(meta_value, '舊網址', '新網址'); UPDATE wp_posts SET post_content = REPLACE(post_content, '舊網址', '新網址'); UPDATE wp_posts SET guid = REPLACE(guid, '舊網址', '新網址');
UPDATE wp_optionsSET option_value = REPLACE(option_value, ‘舊網址’, ‘新網址’)– 僅替換與網站相關的條件WHERE option_name = ‘home’ OR option_name = ‘siteurl’;UPDATE wp_postmetaSET meta_value = REPLACE(meta_value, ‘舊網址’, ‘新網址’);UPDATE wp_postsSET post_content = REPLACE(post_content, ‘舊網址’, ‘新網址’);UPDATE wp_postsSET guid = REPLACE(guid, ‘舊網址’, ‘新網址’);