web

在搭建后的react环境下进入src/index.js文件中写业务：1.引入react & react-dom两个包image.png通过console.log我们发现reactdome自带了一个renderAPI，我们可以通过该api来传递并渲染：语法：ReactDom.render（jsx元素,注入点，回调）eg:image.png效果如下：image.png添加多个元素语法（一定要有…

写移动端项目了，首先考虑到的问题是如何让页面在不同尺寸的移动端能够得到完美的渲染。最开始的时候想法是设置@media的min和max,但是觉得不够方便。对mete进行了如下设置，并引用了手淘的js文件。<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"&g…

运行环境: 本地服务器遇到的问题:1- get方法拿不到静态数据解决方法：1-1 ：请先检查URL是否正确 ； 1-2：请确认this指向（箭头函数时this指向实例，不然指向window）2- 跨域拿php数据(php数据用get & post都拿不到，改成了request就拿到了)3-蠢哭了,postPhp方法的method多写了一个s ！！！！！get静态数据获取：get方法：pos…

启动服务短 - mongodb显示库 - show dbs (初始情况下只有admin & local & config三个库)tips1: test库是一个临时库查看当前库 -db建库/切换激活库 - use <库名>删当前库 db.dropDatabse()在当前库下建集合（表） - db.createCollection('集合名')查看当前集…

在mac安装mongodb之前需要先安装homebrew。1.什么是howmbrew?  --- macOS 缺失的软件包的管理器 (喜欢它的小图标?)官网：https://brew.sh/1.1 安装homebrew:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/mas…

https://www.npmjs.com注册的时候一定要注意去邮箱验证。。。。。。。。建立项目后打开项目文件所在终端执行npm init后对package.js文件进行配置。完成后在终端执行npm login后根据提示输入用户名、密码和邮箱地址。执行npm publish后等结束就可以了在红框标注地方输入文件名或者keywords就能看到啦

Today’s Blueprint is a simple menu with multiple levels. The idea is to animate each menu item once a level is changed. The animation starts with the item clicked and the delays are propagated through…

This Blueprint is page navigation effect based on the Dribbble shot Stacked navigation by Ilya Kostin. The idea is to show a navigation when clicking on the menu button and transform all pages in 3D a…

Today’s Blueprint is a simple content slider with depth-like zoom functionality. Each slide has a predefined zoom area that will be used to calculate the appropriate scale value for a fullscreen fill.…

This Blueprint is a responsive Isotope-powered product grid layout where each grid item is a Flickity image slider. A small cart icon animation indicates that a product was added to the shopping cart.…

This Blueprint is a responsive product grid layout with comparison functionality. A maximum of three items can be selected for the product comparison. The comparison view shows flexbox-powered columns…

This Blueprint is a responsive grid gallery based on the gallery by Google for the Chromebook Getting Started guide. In this Blueprint we use Masonry for the grid and 3D transforms for navigating the …

A full width tab component with some example media queries for adjusting the icons of the tabs and the content layout. The main idea is to show only icons for the mobile view and allow the text to app…

This Blueprint is a layout with two sides, sometimes seen in portfolio websites of couples and partners. The idea is to show an initial two-sided view and when clicking on a side, the whole page trans…

This Blueprint is a template for a on scroll effect layout. We’ve had some requests on how to achieve this effect of animating elements once they are in the viewport and decided to create a Blueprint …

A grid of icons and text that adjusts its number of columns depending on the screen size as shown in some media queries. Some example effects are used for animating the elements on hover. 图标和文本的网格，根据屏…

A layout switch with two viewing modes: grid and list. The layout is defined by a view class that gets applied to the main wrapper. Some example media queries show how to make things responsive. 一种具有两…

An animated header that will change its size on scroll. Once a certain amount of the page gets scrolled, the header will decrease its size and the inner elements will adjust their font-size/line heigh…

This Blueprint is a simple, responsive multi-column form style that comes with example media queries for creating a switching layout. The form has three columns and depending on the screens size, they…

This is a simple tooltip menu that will show a tooltip submenu when hovering over an item. The submenu will either appear above or below the main menu, depending on where more space is available. Usin…

A responsive product grid layout that comes with some UI details for inspiration. The product will rotate showing the backside of the item when the rotate button is clicked. Some examples of how toolt…

A simple, horizontal slide out menu with a grid-like thumbnail layout for the submenu. The menu slides out from the top when a main menu item is clicked and the sub-items fade in. When clicking on ano…

This is a simple responsive timeline with alternating colors for the labels. An icon font is used for the icons in the timeline waypoints and some example media queries show how to adjust the timeline…

A simple scrolling layout with fixed background images using background-attachment: fixed and a navigation. The page will scroll smoothly to the selected section. 一个简单的滚动布局与固定背景图像使用背景附件：固定和导航。页面将顺利滚动到…