javascript - 为 flexGrow 编写数学公式以调整 div 宽度，将字母数和窗口宽度作为变量-6ren

javascript - 为 flexGrow 编写数学公式以调整 div 宽度，将字母数和窗口宽度作为变量

转载作者：行者123 更新时间：2023-12-04 10:47:40

如果你运行下面的代码片段，你会看到我在每个 div 上有一个悬停效果，这会打开一个立即购买按钮..为了使这个工作适用于不同的语言和不同的窗口宽度，我希望使每个 div 的宽度动态取决于“立即购买”div 和窗口宽度中有多少个字母。所以我做了一个时髦的公式，但不确定如何让它在不同的窗口宽度上工作。有人可以帮我做数学吗？

变量是:
flex 成长，
窗口宽度 &
buyNowLetters(div 中的字母数)

    document.addEventListener('DOMContentLoaded', fms())

    function fms(){
        var shadeFinder = document.querySelector('.fms-wrapper')
        var shadeDiv = document.querySelectorAll('.fms-shade')
        var vw = window.innerWidth;

        //first load the right colors in to the divs
        shadeDiv.forEach(div => {
            div.style.backgroundColor = div.getAttribute("fms-bg")
        })

        //mouse hover events
        shadeDiv.forEach(div => {
            div.onmouseenter = function(event) {
                let target = event.target;
                target.classList.add('js-hover')
                var buyNowLetters = target.lastChild.innerHTML.length;
              
                //THIS IS THE FORMULA IVE BEEN TRYING WITH
                target.style.flexGrow = (20000/vw)*(buyNowLetters/19);
            };

            div.onmouseleave = function(event) {
                let target = event.target;
                target.style.background = target.getAttribute("fms-bg");
                target.classList.remove('js-hover')
                target.style.flexGrow = 1;
            };
        })
        
    }

.fms-wrapper {
    height: 300px;
    width: 100%;
    display: flex;
    margin: 100px 0;
    align-items: center;
}

.fms-shade {
    
    flex-basis: auto;
    flex-grow: 1;
    transition: all 0.8s;
    height: 100%;
    transform: scaleY(1);
    position: relative;
    margin-left:-1px;
    overflow: hidden;
    justify-content: center;
    display: flex;
    text-align: center;
    transition-timing-function: ease-in;
}

.fms-shade.js-hover {
 
    transition: all 0.2s;
    height: 120%;
    transition-timing-function: ease-out;
}


/* top bottom text before hover */
.fms-shade > .fms-shade__top {
    position: absolute;
    display: inline-block;
    opacity: 0;
    transition: all 0.2s;
}
.fms-shade > .fms-shade__bottom {
    position: absolute;
    display: inline-block;
    opacity: 0;
    transition: all 0.2s;
    bottom: 10px;
    white-space: nowrap;
}


/* hover over div */
.fms-shade.js-hover > .fms-shade__top {
    position: absolute;
    opacity: 1;
    display: block;
    text-align: center;
    transition: all 0.2s;
}
.fms-shade.js-hover > .fms-shade__bottom {
    position: absolute;
    opacity: 1;
    display: block;
    text-align: center;
    bottom: 10px;
    transition: all 0.2s;
}

<div class="fms-wrapper">
        <div f1 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">B </p></div>
        <div f2 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BW </p></div>
        <div f3 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BU W</p></div>
        <div f4 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BU NW</p></div>
        <div f5 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BU YOW</p></div>
        <div f6 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUY NOW</p></div>
        <div f7 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUY NOWW</p></div>
        <div f8 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUY NOWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUY NOWWW</p></div>
        <div f11 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUU YNOWWWW</p></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p  class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWWWWW</p></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>


    </div>

我什至不确定 flexGrow 是否是最好的方法，也许有更好的方法？

最佳答案

当 div 为空时，您有一个 javascript 错误需要解决:

if(target.lastChild != null)

解决方案:

you might need to small changes on the code, but this to give an idea of how to calculate the width

使用以下 jquery 获取折叠条的宽度

if you have another idea you can implement I'm short in time thats why i used the jquery:

const barWidth =$('.fms-shade').sort(function(a, b){
                                 return $(a).width() > $(b).width(); 
                              }).first().width();

使用以下方法获取当前条形内容宽度:

var contentWidth =target.lastChild.clientWidth;

使用以下代码计算您必须将折叠的 div 宽度乘以多少次才能显示内容。

Math.ceil to get the nearest bigger integer

var flexMCount = Math.ceil(contentWidth/barWidth);

将数字分配给 flexgrow:

target.style.flexGrow =flexMCount;

检查完整代码:

document.addEventListener('DOMContentLoaded', fms())

const barWidth =$('.fms-shade').sort(function(a, b){
                                 return $(a).width() > $(b).width(); 
                              }).first().width();
                              
    function fms(){
        var shadeFinder = document.querySelector('.fms-wrapper')
        var shadeDiv = document.querySelectorAll('.fms-shade')
        var vw = window.innerWidth;

        //first load the right colors in to the divs
        shadeDiv.forEach(div => {
            div.style.backgroundColor = div.getAttribute("fms-bg")
        })

        //mouse hover events
        shadeDiv.forEach(div => {
            div.onmouseenter = function(event) {
                let target = event.target;
                target.classList.add('js-hover')
                if(target.lastChild != null)
                {
                //Get the collapsed bar width
                var contentWidth =target.lastChild.clientWidth;
                 var flexMCount = Math.ceil(contentWidth/barWidth); 
                
               
                  //THIS IS THE FORMULA IVE BEEN TRYING WITH
                  target.style.flexGrow =flexMCount;
                }
            };

            div.onmouseleave = function(event) {
                let target = event.target;
                target.style.background = target.getAttribute("fms-bg");
                target.classList.remove('js-hover')
                target.style.flexGrow = 1;
            };
        })
        
    }

.fms-wrapper {
    height: 300px;
    width: 100%;
    display: flex;
    margin: 100px 0;
    align-items: center;
}

.fms-shade {
    
    flex-basis: auto;
    flex-grow: 1;
    transition: all 0.8s;
    height: 100%;
    transform: scaleY(1);
    position: relative;
    margin-left:-1px;
    overflow: hidden;
    justify-content: center;
    display: flex;
    text-align: center;
    transition-timing-function: ease-in;
}

.fms-shade.js-hover {
 
    transition: all 0.2s;
    height: 120%;
    transition-timing-function: ease-out;
}


/* top bottom text before hover */
.fms-shade > .fms-shade__top {
    position: absolute;
    display: inline-block;
    opacity: 0;
    transition: all 0.2s;
}
.fms-shade > .fms-shade__bottom {
    position: absolute;
    display: inline-block;
    opacity: 0;
    transition: all 0.2s;
    bottom: 10px;
    white-space: nowrap;
}


/* hover over div */
.fms-shade.js-hover > .fms-shade__top {
    position: absolute;
    opacity: 1;
    display: block;
    text-align: center;
    transition: all 0.2s;
}
.fms-shade.js-hover > .fms-shade__bottom {
    position: absolute;
    opacity: 1;
    display: block;
    text-align: center;
    bottom: 10px;
    transition: all 0.2s;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="fms-wrapper">
        <div f1 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">B </p></div>
        <div f2 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BW </p></div>
        <div f3 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BU W</p></div>
        <div f4 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BU NW</p></div>
        <div f5 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BU YOW</p></div>
        <div f6 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUY NOW</p></div>
        <div f7 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUY NOWW</p></div>
        <div f8 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUY NOWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUY NOWWW</p></div>
        <div f11 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUU YNOWWWW</p></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"><p  class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWWW</p></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"><p class="fms-shade__top">F9</p><p class="fms-shade__bottom">BUUYNOWWWWWWWWWWWBUUYNOWWWWWWWWWWW</p></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>

        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(65, 104, 148)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(95, 189, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 168, 72)"></div>
        <div f9 class="fms-shade" fms-bg="rgb(189, 72, 183)"></div>


    </div>

关于javascript - 为 flexGrow 编写数学公式以调整 div 宽度，将字母数和窗口宽度作为变量，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59626603/

文章推荐： c# - 无法从 Linq 翻译 Odata 查询

文章推荐： java - 安卓工作室 : file written to another directory

文章推荐： perl - 我可以在包中注入(inject) perl 子程序吗？

mysql如何在没有函数的情况下识别纯数字和混合数字/字母？
在 MySQL 数据库中，我在表中有一列既有纯数字也有混合数字/字母。没有模式，如果是纯数字我想区分，标记为true，否则为false。有什么好的方法可以使用吗？我试过: ID REGEXP '^[[
从新数据框的列名中删除 "X"字母
这个问题在这里已经有了答案: Numbers as column names of data frames (2 个回答) Why am I getting X. in my column names
javascript - 字母/数字组合的正则表达式
尝试提出一个正则表达式来捕获诸如 AB1234 或 BA2321 之类的组。本质上需要捕获以 AB 或 BA 开头并后跟 4 位数字的任何内容。目前，我有类似的东西，但这似乎没有考虑数字 (AB|B
javascript - 字母 "pyramid"
var z = []; for(var i = 1; i len) z.push("a".repeat(len-i%len)) console.log(z.join("\n")); 关于jav
仅用于数字、字母、空格和连字符的正则表达式
我需要一个仅用于数字、字母、空格和连字符的正则表达式。像这样的 ^[a-zA-Z0-9]+$ 得到字母和数字，但我需要一个用于上述。这些真的很难理解! 最佳答案这是你需要的: /^[0-9A-Za
PDFBox UTF16 字母
有没有人可以帮助我解决 PDFBox 中的字母问题我正在尝试打印字母“ń”(波兰语字母)并且我得到了类似 þÿ J 的东西。 Dı B R O W 2S0 :K0 3I. 请帮忙! 最佳答案我遇到了
javascript - 视差滚动移动单词/字母
关闭。这个问题需要多问focused 。目前不接受答案。想要改进此问题吗？更新问题，使其仅关注一个问题 editing this post . 已关闭 5 年前。 Improve this ques
css - 在各种设备上换行的单词/字母
我尽量不让我的文本 block 把一个词分成几个部分并跳到下一行。对于每种设备尺寸，文本都会中断并造成可读性问题。我尝试将 marring-right 与 % 一起使用，但并没有太大帮助。这是我的哈
C++ 字母 -> 数字
这是我第一次向 Stack Overflow 发帖提问。我是编程新手，所以如果我说的奇怪或错误，请原谅。在下面的文件中；它读取目录并将其保存到变量 nAddress 中。然后删除文件扩展名；将文件分
javascript - 在鼠标悬停时重新排列文本/字母
我希望当用户将鼠标悬停在页面上时，我的页面上的某些文本会重新排列字母。例如，将鼠标悬停在“WORK”上，它就会变成“OWKR”。我怀疑需要 js，但我对 js 还是很陌生。下面是我的 html:
java - 如何获取一系列字符？ (字母)
我已经为此工作了几个小时，现在我有点卡住了....请帮助我。我是一个完全的编程障碍。除字母表方法外，所有方法都可以正常工作。它将接收两个字符(大写或小写)并返回由给定 char 值范围组成的字符串。
c++ - 输入中未知数量的字符串(字母)
我想编写一个程序，在输入的同一行中读取 n 个不同化学元素的名称(其中 1 ≤ n ≤ 17 和 n 也在输入中读取)(名称由空格分开)。化学元素的名称应存储在不同的字符串中以供进一步使用。由于 n
jquery - 在悬停时显示另一个文本/字母
我想隐藏一个字母，并在链接中显示另一个字母，当然，悬停字母的样式不同。例如: 这是一个... ...normal link. 这是一个... ...hovêrêd lînk. 如何实现？谢谢。编辑:
css - 字母 i 上的替代色点
我一直被这个相当愚蠢的想法所挑战。所以我可以用 Blabla[span class=superI]i[/span]rest 替换所有出现的“i”:) 我的想法是在真正的 i“后面”添加一个额外的(红
支持中文、字母、数字的PHP验证码
本文以实例演示5种验证码，并介绍生成验证码的函数。PHP生成验证码的原理：通过GD库，生成一张带验证码的图片，并将验证码保存在Session中。 ?
JS正则表达式必须包含数字、字母、特殊字符
下面给大家介绍下JS正则表达式必须包含数字、字母、特殊字符 js正则表达式要求: 1. 必须包含数字、英文字母、特殊符号且大于等于8位 2. 特殊符号包括: ~!@#$%^&* 正
php - preg_match 字母不仅是字母？
我在这里和网上四处寻找解决方案。问题是我只想接受信件。但是，如果我至少输入一个字母，无论是否有符号或数字，它都会接受。如何获得仅封信？ if (!preg_match("/[a-zA-Z]/",
history - 字母 O 被认为有害？
关闭。这个问题是opinion-based .它目前不接受答案。想改善这个问题吗？更新问题，以便可以通过 editing this post 用事实和引文回答问题. 去年关闭。 Improve th
将(字母)数字字段正确读入 R
制表符分隔的文本文件，实际上是数据库表的导出(使用 bcp)，具有以下形式(前 5 列): 102 1 01 e113c 3224.96 12 102 1 01 e185
php - 循环数据数组并打印 'incrementing' 字母
我需要循环遍历数据数组并为每个数组值打印一个“递增”字母。我知道我可以做到这一点: $array = array(11, 33, 44, 98, 1, 3, 2, 9, 66, 21, 45); //

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 为 flexGrow 编写数学公式以调整 div 宽度，将字母数和窗口宽度作为变量