这个小东西是由ASP.NET MVC,JavaScript和JQuery结合使用的,或许它还有可能会变成另外一种隐藏式或其他方面的使用,或许它的用处并不是很大,但不会缺少的是它那一点小乐趣,总会有它的不同性。
好了,我的代码如下的截图:
1.1 首先我是设置了两个小按钮,用来触发启动的:
1.2再通过css的调整,将两个小按钮从上移到了左下角,同时还为了增强它的隐蔽性,我把它变小了,还把它固定在了显示面,)让它不会因为页面的滚动而被隐藏:
当然页面也是白的:
1.3然后通过JavaScript和JQuery来完成它的动态部分,直接创建函数赋值两个简单易找的one,two。还为了以后的使用性,方便添加其他的内容而单独写成这样。虽然它的代码有点多,但是分工明确。
接下来在内部使用JQuery获取到了第一个按钮 $(".b1") ,隐藏这个按钮,还给字体一个白色。同时第二个按钮显示。 它是显示文档内容,赋值背景黑色,字体白色。同理one对下的two则相反,这样就可以点击一个地方显示两个不同的效果:
1.4 到这里就完成了白黑的双变化,当然为了提高它的效果和突出,我还增加了一个类似于餐厅简节的表格,但并不只是单,还有它的一点小改动。或许你们也有不同的想法,去增加其它不同的东西,更能突出:
白:
夜:
还有它的新增和删除也是能用的,这个表格随按钮变化而变化的。我先将表格的input长度改成120px:
1.5 而表格的新增和删除也是用JavaScript和JQuery来完成的,当然为了缩减js的新增,更变成用jQuery来写。而出现的两个新增,也是为了后面随意更改表格而不影响到另外的一个表格,代码如下:
好了,本次的小乐趣就到这里了,或许你有不同的想法,那就试验一下吧!