站內訊息彈出層簡單實現

2022-03-22 19:06:42 字數 2372 閱讀 6511

由於專案中用到的是dwz框架,想整合layui的彈出層元件,牽扯太多太麻煩,索性自己動手,實現下站內訊息推送右下角彈出層進行提示。**可直接複製使用,樣式撿漏,稍微再調一下吧,簡單展示下。

展示效果

完整**如下

呼叫方法如下:
//在任一頁面如下呼叫即可彈出彈出層(當然了,上面的實現**需要放在layouts主體檢視下,才能在整個**呼叫如下**彈出訊息層)

createnewlowerrightcornerperbox('系統訊息', '訊息主體內容');

--

-- **公告資料表結構設計

---- **公告表

-- create: 2018-03-29 13:50:00

--drop table if exists ueb_website_announcement;

create table `ueb_website_announcement` (

`id` int(11) unsigned not null auto_increment,

`sender_id` int(10) unsigned not null default '0' comment '傳送者 (0系統)',

`receiver_id` int(10) unsigned not null default '0' comment '接收者 (0所有部門)',

`title` varchar(64) not null default '' comment '標題',

`content` varchar(64) not null default '' comment '內容',

`message_type` tinyint(1) not null default '0' comment '公告型別',

`displayorder` tinyint(3) not null default '0' comment '排序值',

`starttime` int(10) unsigned not null default '0' comment '開始時間',

`endtime` int(10) unsigned not null default '0' comment '過期時間',

`createtime` int(10) unsigned not null default '0' comment '建立時間',

`is_delete` tinyint(1) not null default '0' comment '刪除狀態 0-未刪除,1-已刪除',

primary key (`id`),

key `timespan` (`starttime`,`endtime`)

) engine=innodb default charset=utf8;

---- **公告使用者關聯表

-- drop table if exists ueb_website_announcement_user_relation;

create table `ueb_website_announcement_user_relation` (

`id` int(11) unsigned not null auto_increment,

`announcement_id` int(10) unsigned not null default '0' comment '公告',

`user_id` int(10) unsigned not null default '0' comment '接收者',

`readtime` int(10) unsigned not null default '0' comment '查收時間',

`modifytime` int(10) unsigned not null default '0' comment '修改時間',

`createtime` int(10) unsigned not null default '0' comment '建立時間',

`is_read` tinyint(1) not null default '0' comment '閱讀狀態 0-未讀,1-已讀',

`is_delete` tinyint(1) not null default '0' comment '刪除狀態 0-未刪除,1-已刪除',

primary key (`id`),

key `user_id` (`user_id`)

) engine=innodb default charset=utf8;

div css彈出層半透明遮罩層效果實現

背景半透明,覆蓋整個可視區域的遮罩層效果在工作中經常會遇到,這篇文章主要介紹了當內容超過一屏時如何做到多瀏覽器的相容性。下面我們通過乙個簡單的例子看看如何實現,高手請繞道。html 很簡單 1 半透明效果可以使用 css3 中的 opacity 屬性,在低版本的ie瀏覽器中使用ie的alpha 濾鏡...

jquery實現簡單的彈出框

彈出框本身是乙個div,預設是隱藏不展示的,在需要彈框的時候使其顯示,並浮在當前頁面之上 彈框樣式 tanchuang tanchuang img 彈框div form表單 新人入戶頁 style width 200px 大小限制 380 380 value 點選預覽彈出div previewimg...

PHP Redis 實現簡單訊息佇列

redis做訊息佇列的好處在於它的輕量級,高併發,延遲敏感,應用場景有 即時資料分析 秒殺計數器 快取等 redis做訊息佇列待解決的問題 1 訊息的可靠性 沒有相應的機制保證訊息的消費,當消費者消費失敗的時候,訊息體丟失,需要手動處理。生產者只管向佇列中插入資料,不管消費者是否成功消費。2 消費者...