分类：九宫格

2022
11-02

JavaScript canvas实现九宫格切图效果

本文实例为大家分享了canvas实现九宫格切图效果的具体代码，供大家参考，具体内容如下首先页面展示直接上代码<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatible"content="ie=edge"><title>Document</title><style>body{text-align:center;}... 继续阅读 >
2021
11-07

微信小程序实现九宫格效果

微信小程序实现九宫格效果 本文实例为大家分享了微信小程序实现九宫格效果的具体代码，供大家参考，具体内容如下1.九宫格实现示例图：Tips:说明：使用display:-webkit-flex;对布局做兼容。保证每排三个图标的两对对齐，采用：justify-content:space-between;属性。父元素必须设置flex-wrap:wrap;属性进行换行，否则会在一排展示。个子元素的宽度width:33.33333333%;按照其占位大小分配。使用justify-content:center;属性设置元素居中。使用flex-dire... 继续阅读 >
2020
11-01

java实现九宫格游戏

java实现九宫格游戏 本文实例为大家分享了java实现九宫格游戏的具体代码，供大家参考，具体内容如下代码思路：创建了一个九宫格按钮类(继承了JButton),定义了一个九宫格类，先随机生成8个数，用网格排版放入9个格子，然后在游戏创建了3x3的矩阵用于存储状态，再对每个按键加监听器，当按下去时判断能否移动，能移动则交换空格和这个按钮的名字，每次按下去判断是否从1－8排布，判断是否赢。由于随机生成的排序，所以没有考虑到无解的情况。如果要使有... 继续阅读 >
2020
10-10

原生JS实现九宫格抽奖

本文实例为大家分享了JS实现九宫格抽奖的具体代码，供大家参考，具体内容如下上代码：<divclass="wrapper"><div>谢谢惠顾</div><div>十万元现金</div><div>谢谢惠顾</div><div>iphone11</div><div>抽奖</div><div>美的冰箱</div><div>谢谢惠顾</div><div>50元红包</div><div>谢谢惠顾</div></div><divclass="result"></div>CSS样式代码：<style>.wrapper{width:300px;h... 继续阅读 >
2020
09-30

js实现九宫格布局效果

js实现九宫格布局效果 本文实例为大家分享了js实现九宫格布局效果的具体代码，供大家参考，具体内容如下效果代码如下：<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title></title><styletype="text/css">*{margin:0;padding:0;}#container{width:1200px;margin:0auto;}#top{padding:20px;}#bottom{position:relative;}.box{//每一个小块width:220px;height:360px;margin:015px15... 继续阅读 >
2020
09-28

使用Python将图片转正方形的两种方法实例代码详解

使用Python将图片转正方形的两种方法实例代码详解 一、将原图粘贴到一张正方形的背景上deftrans_square(image):r"""OpentheimageusingPIL."""image=image.convert('RGB')w,h=image.sizebackground=Image.new('RGB',size=(max(w,h),max(w,h)),color=(127,127,127))#创建背景图，颜色值为127length=int(abs(w-h)//2)#一侧需要填充的长度box=(length,0)ifw<helse(0,length)#粘贴的位置background.paste(image,box)returnb... 继续阅读 >
2020
09-24

js实现九宫格抽奖

本文实例为大家分享了js实现九宫格抽奖的具体代码，供大家参考，具体内容如下<divid="contaner"><divid="one">一块钱</div><divid="two">谢谢惠顾</div><divid="three">下去写作业</div><divid="four">一局游戏</div><divid="five">点击抽奖</div><divid="six">两块钱</div><divid="seven">下去写作业</div><divid="eight">谢谢惠顾</div><divid="nigth">两局游戏</div></div>CSS：#contaner{width:606px;he... 继续阅读 >