Слияние кода завершено, страница обновится автоматически
Предварительный просмотр всех компонентов http://candypop.gitee.io/layui-plugin
Можно добавить в свой веб-сайт клавиатуру, имитирующую клавиатуру Windows 10. Вы можете указать клавиши для подсветки и имитации нажатия.
Сначала необходимо указать на своей странице div для размещения клавиатуры. Клавиатура будет адаптироваться к размеру вашего div.
<div id="keyboard" style="width: 1000px;height: 300px;margin:0 auto;"></div>
Затем вы импортируете плагин, передавая идентификатор div.
<script type="text/javascript">
layui.config({
base: 'plugin/'
}).use(['jquery', 'keyboard'], function() {
var $ = layui.jquery,
keyboard = layui.keyboard;
var k=keyboard.render({
elem:"keyboard"
});
});
</script>
Если вам нужно подсветить определённую клавишу, вы можете напрямую использовать F12 для просмотра её кода, а затем вызвать метод.
layui.config({
base: 'plugin/'
}).use(['jquery', 'keyboard'], function() {
var $ = layui.jquery,
keyboard = layui.keyboard;
var k=keyboard.render({
elem:"keyboard"
});
// Просто электропитание j и o
k.keys(["j","o"]);
// На основе fn ключа подсветить 5
k.fn(["Key-5"]);
// На основе shift ключа подсветить 0
k.shift(["Key-0"]);
});
Недавно я исследовал возможность встраивания live2d в веб-страницу, чтобы можно было разместить там свою собственную модель live2d. Здесь просто объединены веб-сайт live2d и некоторые другие замечательные скрипты live2d, которые можно легко интегрировать, просто импортировав скрипт.
Прежде всего, на веб-странице необходимо импортировать холст с фиксированным идентификатором и классом. Ширина и высота зависят от ваших предпочтений.
<canvas id="live2d" width="200" height="200" class="live2d" style="position: fixed; top: 25%;right: 50%; opacity: 1; z-index: 99999; pointer-events: none;"></canvas>
Далее идёт скрипт, который мне нужно импортировать два скрипта, а затем вызвать метод для импорта моей собственной модели live2d. Обратите внимание! Порядок импорта live2dbundle и live2dcore должен быть правильным.
layui.config({
base: 'plugin/'
}).use(['jquery', 'layer', 'live2dbundle','live2dcore'], function() {
var $ = layui.jquery;
var resourcesPath = './asset/'; // Путь сохранения файлов ресурсов (моделей)
var backImageName = ''; // Фоновое изображение по умолчанию пусто
var modelDir = ['helena']; // Список моделей для загрузки
initDefine(resourcesPath, backImageName, modelDir); // Инициализация модели
});
В качестве примера рассмотрим мою папку с ресурсами.
После этого персонаж начнёт двигаться в соответствии с параметрами, заданными в вашем программном обеспечении live2D. Если вы хотите больше взаимодействия, вы можете установить прослушиватели для пользовательских меню и т. д. на холсте и разработать их самостоятельно.
Этот плагин расширяет исходные функции upload в layui, позволяя пользователям настраивать пути загрузки файлов, пути скачивания и пути удаления и полностью поддерживать исходные параметры upload. При передаче параметров в upload, необходимо добавить ex и page параметры для определения дополнительных функций плагина uploadx. В настоящее время этот плагин должен находиться в форме.
<body>
<form class="layui-form layui-form-pane" action="" style="width: 300px;height:400px;padding: 10px;border:1px solid #F0F0F0;margin: 40px auto;" lay-filter="example">
<!-- Используется для заполнения данных формы -->
<input type="hidden" name="id" value="66" />
<div class="layui-form-item">
<label class="layui-form-label">Однострочное поле ввода</label>
<div class="layui-input-block">
<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="Введите заголовок" class="layui-input">
</div>
</div>
<!-- Отображение соответствующего содержимого в виде компонента загрузки вложений -->
<div id="up"></div>
<div id="up1"></div>
</form>
</body>
<script type="text/javascript">
layui.config({
base: 'plugin/'
}).use(['jquery', 'layer', 'uploadx','form'], function() {
var $ = layui.jquery,
uploadx = layui.uploadx,
upload = layui.upload,
form = layui.form;
uploadx.render({
ex:{
elem:"#up",
``` **Текст запроса:**
```javascript
url:'./data/uploadx.json',//模拟请求
// #issue I48IA0
biz:'biz1',//用于区别单个表单下若存在多个附件上传的功能，用于区别他们之间的内容。
name:'文件上传',
form:'example',
mainId:'id',//默认也是这个名字
down:function(file){ //新增内容
console.log(file);
},
del:function(file){
console.log(file);
},
upload:function(file){
console.log(file);
}
},
page:{
limit:8
}//分页的参数
});
uploadx.render({
ex:{
elem:"#up1",
url:'./data/uploadx2.json',//模拟请求
biz:'biz2',//用于区别单个表单下若存在多个附件上传的功能，用于区别他们之间的内容。
name:'文件上传2',
title:'up2',
form:'example',
mainId:'id'//默认也是这个名字
}
});
});
</script>
Перевод:
URL: './data/uploadx.json', // имитация запроса
// #issue I48IA0
biz: 'biz1', // используется для различения функций загрузки нескольких вложений в одной форме, чтобы различать их содержимое.
name: 'Загрузка файла',
form: 'example',
mainId: 'id', // по умолчанию это имя
down: function (file) { // новое содержимое
console.log(файл);
},
del: function (файл) {
console.log(файл);
},
upload: function (файл) {
console.log(файл);
}
},
page: {
limit: 8
} // параметры разбивки на страницы
});
uploadx.render ({
ex: {
elem: "#up1",
URL: './data/uploadx2.json', // имитация запроса
biz: 'biz2', // используется для различения функций загрузки нескольких вложений в одной форме, чтобы различать их содержимое.
name: 'Файл загрузки 2',
title: 'up2',
form: 'пример',
mainId: 'id' // по умолчанию это имя
}
});
});
``` Данный запрос содержит код на языке JavaScript, который используется для работы с библиотекой LayUI. В запросе также есть HTML-разметка, которая описывает структуру веб-страницы.
**Перевод кода JavaScript:**
```javascript
uploadx.addExt({
ext: 'txt',
type: 'svg',
icon: '<svg t="1629904039173" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1280" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M192 0h448.1536L960 320v576c0 70.6944-57.3056 128-128 128H192C121.3056 1024 64 966.6944 64 896V128C64 57.3056 121.3056 0 192 0z" fill="#2696FF" p-id="1281"></path><path d="M417.7536 546.176h-60.8256v170.5728h-40.9216V546.176H256V512h161.7536v34.176z m94.3872 36.416L549.376 512h47.0528l-57.8304 101.5296 59.328 103.2192h-47.6032l-38.1824-71.7184-38.1952 71.7184h-47.6032l59.3408-103.2192L427.8528 512h47.0528l37.2352 70.592zM768 546.176h-60.8256v170.5728H666.24V546.176h-60.0064V512H768v34.176z" fill="#FFFFFF" opacity=".9" p-id="1282"></path><path d="M640 0l320 320H768c-70.6944 0-128-57.3056-128-128V0z" fill="#8FC6FE" p-id="1283"></path></svg>'
});
uploadx.render({
//...
});
// 添加 .json类型的文件icon
uploadx.addExt({
ext: 'json',
type: 'img',
icon: './icon/uploadx/javascript.png'
});
Данный фрагмент кода добавляет поддержку новых типов файлов в компонент uploadx. Метод addExt() позволяет добавить новый тип файла с помощью параметров ext, type и icon. Параметр ext определяет расширение файла, параметр type — тип иконки, а параметр icon — путь к иконке.
В данном случае добавляется поддержка файлов с расширением txt и типом иконки svg. Также добавляется поддержка файлов с расширением json и типом иконки img.
Код не содержит контекста, поэтому невозможно определить, как именно он будет использоваться в приложении.
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )