我最近开始学习编码一些HTML和CSS,并且我有一个包含一些设计元素的Web应用程序,我不知道如何编码或找到正确的方向关于如何编码(我似乎无法匹配我的搜索中的任何内容,这些都是我想要的)。HTML/CSS根据文本更改锚点。长度
我希望根据用户名中字符的长度来扩展或缩短锚(img)的宽度。
我知道CSS自己做不到。我相信JQuery或Javascript可以处理这个任务,但我不知道如何去做或者从哪里开始。
//我对JavaScript和JQuery的理解有点有限。所以我现在最好的方向是创建一个与用户名中字符串的.length相匹配的div,或者将anchor宽度更改为username.length字符串的宽度的函数。也许是这样的效果:
$('anchor').ready(function() { var anchorWidth = $('username').text().length; });
这是正确的方向吗?或者我离开了商标?
编辑
>HTML code:
$('imgLength').ready(function() {
var matchLength = this.text().length;
if (matchLength = this.text.length) {
this.width(text.width);
}
});
到目前为止我的脚本看起来更是现在这个样子:
$(document).ready(function() {
$('.js-dropdown').on('click', function() {
var $underline = $('.js-underline');
var $userNameLength = $('.js-userNameLength');
console.log($underline);
console.log($userNameLength);
$underline.css('width', $userNameLength.width());
});
});
锚IMG可以是一个边界,我想通了。该图像只是我制作的具有我选择的渐变色的条形线。
2016-05-23
Liam Fox
+0
“我是否从标记中脱离出来”......是的,至少担心这个脚本是如何写的。请提供一些相关的html –
+0
_“我知道CSS自己无法做到这一点”_你可以在问题中包含'html'吗? –
+0
我加了我的HTML代码,有问题的部分是 -