激活大脑的十个方法-CSDN博客

激活大脑的十个方法

　　1.用蓝色装饰环境。

　　色彩心理学研究发现，看到两次蓝色物体，人的想法会更积极。快给自己营造一个“蓝色港湾”吧。

　　2.适当喝点酒。

　　美国伊利诺伊大学芝加哥分校的研究人员发现，社交活动中少量喝点酒，思维能力更强，更容易“灵感突现”。

　　3.做白日梦。

　　加拿大大学的一项研究指出，爱做白日梦的人，各项创造力测试得分更高。赶快抽点时间，让你的思维天马行空。

　　4.把自己想象成孩子。

　　当一个人想象回到童年时，大脑更容易出现一些“稀奇古怪”的想法。保持一颗童心，你的心理就不会衰老。

　　5.放声大笑。

　　有人发现，当人们看完一段惹人发笑的喜剧短片后，能够比平时多解决20%的问题。笑容，可以拯救我们疲劳、紧张的神经。

　　6.想象自己身处远方。

　　美国印第安纳大学研究发现，想象自己在一个遥远的地方，人的能力似乎更容易发挥出来。

　　7.少说晦涩的词语。

　　如果总把一些专业用语挂在嘴边，人的思维也会不自觉地变狭隘。建议我们还是多说“大白话”，在平凡中创造奇迹。

　　8.换个工作环境。

　　“环境影响心态”，老在一个固定的地方待着，思维也容易受限制。换个地方，哪怕换把椅子，也会大有不同。

　　9.走到外面看看。

　　开放的世界给人开放的思想，感觉大脑枯竭时，不妨站起来到外面走走，让大千世界带给你灵感和创意。

　　10.去繁华的地方。

　　美国圣塔菲学院的研究发现，在繁华的城市中，人的创意能增强15%。不妨用“花花世界”刺激一下大脑。

left

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .menu{
            float: left;width: 30%;height: 500px;background-color: aquamarine;
        }
        .content{
            float: left;width: 70%;height: 500px;background-color: darkblue;
        }
        .title{
            background-color: black;color: chartreuse;height: 30px;
            line-height: 30px;
        }
        .hide{
            display: none;
        }
        .curr{
            color: red;
        }
    </style>
</head>
<body>
    <div>
        <div class="menu">
            <div class="item">
                <div class="title" onclick="Func(this)">菜单一</div>
                <div class="body">
                    <div>1111111</div>
                    <div>1111111</div>
                    <div>1111111</div>
                </div>
            </div>
            <div class="item">
                <div class="title" onclick="Func(this)">菜单二</div>
                <div class="body hide">
                    <div>2222222</div>
                    <div>2222222</div>
                    <div>2222222</div>
                </div>
            </div>
            <div class="item">
                <div class="title" onclick="Func(this)">菜单三</div>
                <div class="body hide">
                    <div>3333333</div>
                    <div>3333333</div>
                    <div>3333333</div>
                </div>
            </div>
        </div>
        <div class="content"></div>
    </div>
    <script src="jquery-1.12.4.js"></script>
    <script>
        function Func(ths) {
            console.log($(ths).text())
            $(ths).next().removeClass('hide')
            $(ths).parent().siblings().find('.body').addClass('hide');
            $(ths).addClass('curr').parent().siblings().find('.curr').removeClass('curr')
        }
    </script>
</body>
</html>

View Code

left

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>

        body{
            margin: 0px;
        }
        img {
            border: 0;
        }
        ul{
            padding: 0;
            margin: 0;
            list-style: none;
        }
        .clearfix:after {
            content: ".";
            display: block;
            height: 0;
            clear: both;
            visibility: hidden;
        }

        .wrap{
            width: 980px;
            margin: 0 auto;
        }

        .pg-header{
            background-color: #303a40;
            -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.2);
            -moz-box-shadow: 0 2px 5px rgba(0,0,0,.2);
            box-shadow: 0 2px 5px rgba(0,0,0,.2);
        }
        .pg-header .logo{
            float: left;
            padding:5px 10px 5px 0px;
        }
        .pg-header .logo img{
            vertical-align: middle;
            width: 110px;
            height: 40px;

        }
        .pg-header .nav{
            line-height: 50px;
        }
        .pg-header .nav ul li{
            float: left;
        }
        .pg-header .nav ul li a{
            display: block;
            color: #ccc;
            padding: 0 20px;
            text-decoration: none;
            font-size: 14px;
        }
        .pg-header .nav ul li a:hover{
            color: #fff;
            background-color: #425a66;
        }
        .pg-body{

        }
        .pg-body .catalog{
            position: absolute;
            top:60px;
            width: 200px;
            background-color: #fafafa;
            bottom: 0px;
        }
        .pg-body .catalog.fixed{
            position: fixed;
            top:10px;
        }

        .pg-body .catalog .catalog-item.active{
            color: #fff;
            background-color: #425a66;
        }

        .pg-body .content{
            position: absolute;
            top:60px;
            width: 700px;
            margin-left: 210px;
            background-color: #fafafa;
            overflow: auto;
        }
        .pg-body .content .section{
            height: 500px;
        }
    </style>
</head>
<body>

    <div class="pg-header">
        <div class="wrap clearfix">
            <div class="logo">
                <a href="#">
                    <img src="http://core.pc.lietou-static.com/revs/images/common/logo_7012c4a4.pn">
                </a>
            </div>
            <div class="nav">
                <ul>
                    <li>
                        <a  href="#">首页</a>
                    </li>
                    <li>
                        <a  href="#">功能一</a>
                    </li>
                    <li>
                        <a  href="#">功能二</a>
                    </li>
                </ul>
            </div>

        </div>
    </div>
    <div class="pg-body">
        <div class="wrap">
            <div class="catalog">
                <div class="catalog-item" auto-to="function1"><a>第1张</a></div>
                <div class="catalog-item" auto-to="function2"><a>第2张</a></div>
                <div class="catalog-item" auto-to="function3"><a>第3张</a></div>
            </div>
            <div class="content">

                <div menu="function1" class="section">
                    <h1>第一章</h1>
                </div>
                <div menu="function2" class="section">
                    <h1>第二章</h1>
                </div>
                <div menu="function3" class="section">
                    <h1>第三章</h1>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript" src="jquery-1.12.4.js"></script>
    <script type="text/javascript">
        window.onscroll = function () {
            // 先计算了滑轮滚动了多少
            var ws = $(window).scrollTop();

            // 大于50px，固定左侧菜单
            if(ws > 50){
                $('.catalog').addClass('fixed');
            }else {
                $('.catalog').removeClass('fixed');
            }

            //找到 并 循环所有内容
            // $('.content').children()  拿到子标签
            $('.content').children().each(function () {

                //获取到的每一个子标签 离顶部的页面有多少距离 offset 当前标签里顶部有多少像素
                var offs = $(this).offset();

                // offset中的top方法就是距离顶部的距离
                var offTop = offs.top;

                // 当前标签离顶部高度 < 滚动条高度
                // 当前标签离顶部高度 + 当前标签的高度 > 滚动条高度
                var total = offTop +　$(this).height();
                if(ws>offTop && total >ws){

                    //找到menu
                    var t = $(this).attr('menu');

                    //拼接获取到的字符串
                    var target = 'div[auto-to="'+t+'"]';
                    $('.catalog').children(target).css('fontSize','48px').siblings().css('fontSize','12px');
                }
            });
        }
    </script>
</body>
</html>

转载于:https://www.cnblogs.com/lilidun/p/5837572.html