主页 / user-213990

Andrew Gor's questions

Martin Hope
Andrew Gor
Asked: 2020-10-20 21:21:54 +0000 UTC
  • 0

有一个由tilda.cc构造函数形成的菜单，我需要更改此菜单中的一些项目。每个菜单项都有自己的属性 - data-menu-item-number。

如何使用 javaScript 更改单个项目的样式（颜色、样式）？

试过：

document.getElementsByTagName('data-menu-item-number')
document.getElementsByName('data-menu-item-number')

没有结果。也许我没有正确使用语法。

document.addEventListener('DOMContentLoaded', function() {
  //documennt.someFunction ? ? ? ? ?
});
<div class="t450__container t-align_left" style="height: auto;">
  <div class="t450__top">
    <div class="t450__menu">
      <ul class="t450__list">
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="1">ABOUT</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="2">WORKS</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="3"> - All</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="4"> - City art</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="5"> - Dwelling</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="6">WORKFLOW</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="7">DETAILS</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="8">AWARDS &amp; CLIENTS</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="9">CONTACT US</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="10">FOLLOW US</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="11">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="12">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="13">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="14">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="15">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="16">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="17">SOMETHING</a> </li>
        <li class="t450__list_item"><a class="t-menu__link-item " href="" style="color:#000000;font-size:12px;font-weight:500;font-family:'HelveticaNowDisplay';margin-bottom:10px;" data-menu-item-number="18">SOMETHING</a> </li>
      </ul>
    </div>
  </div>
  <div class="t450__rightside">
    <div class="t450__rightcontainer">
      <div class="t450__right_descr t-descr t-descr_xs" field="descr" style="font-family:'HelveticaNowDisplay';">I am ready for a long road flight for working with a week- or months-long projects.</div>
    </div>
  </div>
</div>

提前感谢您的帮助。

javascript
Martin Hope
Andrew Gor
Asked: 2020-10-18 02:41:47 +0000 UTC
  • 1

需要帮助/建议。我需要在站点构建器https://tilda.cc/ru/的 html 块 (T123) 中使用我的自定义字体。这是一个示例代码：http://maasslending.tilda.ws/font只有 Safari 的字体才能正常呈现。Chrome、Firefox、Opera - 不显示字体。据我了解，这些浏览器不会从其他域加载字体。据我了解，这是连接字体的唯一方法，因为 Tilda 不允许您将文件上传到主机。

我尝试使用 base64 将字体集成到 CSS 代码中，但 Tilda 根本不接受这样的代码。

有没有办法解决我的问题？

提前致谢。

html
Martin Hope
Andrew Gor
Asked: 2020-10-07 20:08:50 +0000 UTC
  • 3

网站上有一个菜单 ( <input type="checkbox" id="hmt" class="hidden-menu-ticker">)，最初它是隐藏的。用户可以通过按下按钮打开/关闭菜单。假设用户打开了菜单，我需要：

  1. 如果用户向任一方向滚动页面 100 像素，则应关闭菜单。
  2. 如果用户单击了菜单块之外的页面上的任何位置，请关闭菜单。

我想出了如何在滚动后显示菜单。但我仍然不知道在滚动一定数量的像素后如何隐藏它。据我了解，我需要将滚动的像素数存储在一个变量中。接下来，如果用户没有用鼠标滚动，我需要重置这个变量，比如说 5 秒。那么如何理解用户当前没有滚动呢？

<script>
        window.addEventListener('scroll', function () {
            var pixelCount = window.pageYOffset;
            if (pixelCount < 300) {document.getElementById("hmt").checked = false;}
            if (pixelCount > 300) {document.getElementById("hmt").checked = true;}
        })
</script>

提前感谢您的帮助。

javascript
Martin Hope
Andrew Gor
Asked: 2020-09-25 18:53:59 +0000 UTC
  • 12

在svg中有一个徽标。

我需要根据徽标下的主色将徽标的颜色更改为白色或黑色。

我试图为此目的使用插件BackgroundCheck。在一个干净的html插件中，它可以工作，但是当我加载它时Тильду，它就不起作用了。

在我看来，我的风格被忽视了。我究竟做错了什么？

<!--logo-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<html>

<head>
  <style type="text/css" media="screen">
    .images {
      width: 100%;
      display: block;
    }
    
    .fixed-nav {
      /* 	background-color: red; */
      position: fixed;
      left: 100px;
      top: 47px;
      width: 80px;
      z-index: 99999;
    }
    
    .fixed-nav.background--dark .fixed-nav-line {
      /*   background: #fff; */
    }
    
    .fixed-nav.background--dark .fixed-nav-logo {
      background-image: url(https://static.tildacdn.com/tild3831-3566-4637-b934-383138346332/Awhite.svg);
      height: 43px;
      width: 33px;
      /* 		fill: white; */
      /*   color: #fff; */
    }
    
    .fixed-nav.background--light .fixed-nav-logo {
      background-image: url(https://static.tildacdn.com/tild6133-3534-4237-b863-666531326632/A.svg);
      height: 43px;
      width: 33px;
    }
    
    .fixed-nav-line,
    .fixed-nav-logo {
      background-image: url(https://static.tildacdn.com/tild6133-3534-4237-b863-666531326632/A.svg);
      display: inline-block;
      vertical-align: middle;
      margin: 0;
      padding: 0;
    }
    
    .fixed-nav-line {
      width: 40px;
      height: 3px;
      background: #222;
    }
    
    .fixed-nav-logo {
      /* 	background-color: yellow; */
      width: 33px;
      height: 43px;
      font-size: 28px;
      font-weight: bold;
      text-align: center;
      z-index: 99999;
    }
  </style>
  <script src="https://hosting.maass.ua/background-check.min.js"></script>
  <script src="https://hosting.maass.ua/fixed-nav.js"></script>
</head>

<body>
  <!--<div class="fixed">-->
  <div class="fixed-nav">
    <a href="#">
      <div class="fixed-nav-logo"></div>
    </a>
  </div>
  <!--</div> -->
  <div class="images">
    <img class="images" src="https://static.tildacdn.com/tild6361-3535-4136-a662-353763663866/12049949b04d4882bcdf.jpg" />
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <img class="images" src="https://static.tildacdn.com/tild3837-6362-4139-b933-616635623530/maass-RO-hall-30.jpg" />
  </div>
</body>

</html>

PS也许还有其他方法可以解决我的问题？

提前致谢。

javascript