Giter Site home page Giter Site logo

sqxccdy / litewebchat_frame Goto Github PK

View Code? Open in Web Editor NEW

This project forked from morfanslab/litewebchat_frame

0.0 1.0 0.0 151 KB

一个简洁,易用的 HTML 聊天框架

Home Page: https://lab.morfans.cn/LiteWebChat_Frame/

License: Do What The F*ck You Want To Public License

HTML 72.10% CSS 27.90%

litewebchat_frame's Introduction

轻网页聊天框架

演示

性感聊天在线观看(在线演示)

本框架 大部分聊天对话所要求的特性已完成,能够助你快速开发聊天类对话界面

使用 指南 (指北)

安装

我们仅提供了两种方式来获取 LiteWebChat_Frame, 但你可以通过各种奇淫技巧获取使用。

下载文件

你可以直接从 GayHub 项目 官网 直接克隆下载,其中包含了压缩过的和未压缩过的 CSS 和 一个例子文件,以及图片文件。

直接引用

<link type="text/css" href="https://lab.morfans.cn/LiteWebChat_Frame/litewebchat.min.css" rel="stylesheet" />

<link type="text/css" href="https://lab.morfans.cn/LiteWebChat_Frame/litewebchat.css" rel="stylesheet" />

创建容器

<div class="lite-chatbox">
...
</div>

兼容性

兼容 Edge和其他主流浏览器的最新版本。

对于IE浏览器请微修改右对话气泡背景即可使用

参考

组件

聊天气泡

气泡

组件(类名) Class 附加类名 / 备注
聊天气泡组件(cmsg) cleft(左边) / cright(右边)
头像 (headIcon) 默认方形 / radius(圆形头像)
头衔 (htitle) 默认成员头衔 / admin(管理头衔) / owner(群主头衔)
名称(name) 为空使用 ‘&nbsp;’
聊天内容(content) -

Example:

    <div class="cright cmsg">
        <img class="headIcon radius" ondragstart="return false;"  oncontextmenu="return false;"  src="./img/B.jpg" />
        <span class="name">SuperPaxxs</span>
        <span class="content">LiteChat_Frame(轻聊天气泡框架),一个贼简洁 <del>(简单)</del> 、美观、易用的 HTML 聊天界面框架</span>
    </div>

系统提示

提示

类名 效果
tips 正常
tips-primary 首要的提示
tips-success 成功提示
tips-info 信息提示
tips-warning 警告提示
tips-danger 错误/危险提示

Example:

    <div class="tips">
        <span class="tips-danger">系统消息:左/右边长消息被管理员批判一番……</span>
    </div>

    <div class="tips">
        <span>系统消息:normal</span>
    </div>

litewebchat_frame's People

Contributors

paxxs avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.