主页 / user-314686

recile's questions

Martin Hope
recile
Asked: 2020-06-21 15:26:04 +0000 UTC
  • 0

<div class="col-sm-8">
              <div class="upload-button">
                  <input class="btn btn-primary" type="button" value="Новая вакансия +" onclick="document.getElementById('addResume').className == '' ? 'hidden' : ''">
              </div>
              <div class="" id="addResume" >
              <!-- ----------------- -->
              <div class="form-group">
                <input type="text" class="form-control input-lg" placeholder="Название вакансии">
              </div>
              <div class="form-group col-xs-12">
                <h6 >Требуемый опыт</h6>
                <div class="checkall-group"  >

                  <div class="checkbox " > 
                    <input type="checkbox" id="rate1" name="rate" >
                    <label for="rate1" >Не имеет значения</label>
                  </div>
  
                  <div class="checkbox " >
                    <input type="checkbox" id="rate2" name="rate">
                    <label for="rate2">Без опыта </label>
                  </div>
  
                </div>
              </div>
              <div class="upload-button">
                <input class="btn btn-primary" type="button" value="Создать и опубликовать">
              </div>
                  <br><br>
            </div>
          </div>

javascript
Martin Hope
recile
Asked: 2020-04-30 07:17:32 +0000 UTC
  • 1

第一个按钮改变颜色，第二个按钮改变形状。如果你从一开始就按颜色然后改变，它仍然会继续改变颜色，反之亦然..

首先，按下按钮，然后是方块，
两个按钮应该只做他们的工作，
一个只改变第二个只油漆，现在，依次按下后，它们获得属性，新的和前一个开始改变和颜色颜色同时显示，正确的颜色分开

let btn_paint_bucket = document.querySelector('.btn-paint-bucket');
let btn_choose_color = document.querySelector('.btn-Choose-color');
let btn_move = document.querySelector('.btn-move');
let btn_transform = document.querySelector('.btn-transform');
let field = document.querySelector('.field');

let currentTool;

btn_paint_bucket.addEventListener('click', function (e) {
  field.addEventListener('click', function (e) {
      var selectedTd;
      let target =event.target;
      highlight(target); 
    
      function highlight(node) {
        node.classList.add('highlight');
      }
    })
})

btn_transform.addEventListener('click', function (e) {
  field.addEventListener('click', function (e) { 
      var selectedTd;
      let target =event.target;
      highlight(target);
      
      function highlight(node) {
        if(node.classList.contains('transform-cilcle')){
          node.classList.remove('transform-cilcle');
        } else {
          node.classList.add('transform-cilcle');
        }
      }
    })
})
.field {
  width: 600px;
  height: 600px;
  margin: auto;
  background: silver;
  overflow: hidden;
}

.inside{
  width: 190px;
  height: 190px;
  margin: 1px;
  border: solid;
  float: left;
  box-sizing: border-box;
  background-color: rgb(151, 150, 150);
}

.transform-cilcle{
  border-radius: 190px;
}

.highlight{
  background-color: red;
}
<span class="btn-paint-bucket" style="cursor: pointer;"> <img src="assets/icons/i1.png" alt=""> Paint </span>
<span class="btn-transform"style="cursor: pointer;" ><img src="assets/icons/i4.png" alt="">Transform</span>
<div class="field">
  <div class="inside"></div>
  <div class="inside"></div>
  <div class="inside"></div>
  <div class="inside"></div>
  <div class="inside"></div>
  <div class="inside"></div>
  <div class="inside transform-cilcle"></div>
  <div class="inside "></div>
  <div class="inside"></div>
</div>

javascript
Martin Hope
recile
Asked: 2020-04-28 02:28:37 +0000 UTC
  • 2

例如，从一个正方形中取一个红色或绿色，然后用这种颜色在圆形上涂色？

.red{
  width: 10px;
  height: 10px;
  background-color: red;
}

.green{

   width: 10px;
  height: 10px;
  background-color: green;
}

.circle{
  
  width: 30px;
  height: 30px;
  border: solid;
  border-radius: 20px;
}
<div class="red" ></div>
<br>
<div class="green"></div>

<br>

<div class="circle"></div>

javascript
Martin Hope
recile
Asked: 2020-04-21 13:35:00 +0000 UTC
  • 0

如何让标题背景图片占据屏幕的 70%？并且立即 main 没有通过？

h1, h2 {
  font-family: Lato;
}
* {
  margin: 0;

}

  
  border: solid;
   background-image: url(); 
  height: 70%;
  background-repeat: no-repeat;
  background-position: center; 
  
  background-size: cover;
  position: relative;
}

.inner-container{
  text-align: center;
  position: absolute;
  width: 100%;
  height: auto;
  margin-top: 85px;
}
<div id="app"></div>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="style.css">
  <title>Document</title>
</head>
<body>
  <header class="header">
    <div class="img-container">
    
      <div class="inner-container">
             
          <nav><a href="1.html">Чебурашка</a> | <a href="2.html">Гена</a> |
            <a href="3.html">Шапокляк</a> | <a href="4.html">Лариска</a></nav>
      </div>
    </div>
  
  </header>
  <main class="container">  
  <aside class="menu-primary">111 111 111 111</aside>
  <section class="main">
    <p>main</p>
    <p>main</p>
    <p>main</p>
    <p>main</p>
  </section>
    <aside class="menu-secondary">555 5551 5551 555</aside>

  </main>
  <footer class="footer">footer footer footer</footer>
</body>
</html>

css
Martin Hope
recile
Asked: 2020-01-20 02:55:29 +0000 UTC
  • 2

如何在拖动到另一个元素（图片）时移除一个元素（图片） Drag'n'Drop 如何在拖动到大门时移除一个球（球的移动）请帮忙

var ball = document.getElementById("ball");

ball.onmousedown = function(e){

    var coords = getCoords(ball);
    shiftX = e.pageX - getCoords(ball).left;
    shiftY = e.pageY - getCoords(ball).top;

    ball.style.position = "absolute";
   moveAt(e);


    document.body.appendChild(ball);

    ball.style.zIndex = 1000;

    

    function moveAt(e) {
        ball.style.left = e.pageX - shiftX + "px";
        ball.style.top = e.pageY - shiftY + "px";
    }


    document.onmousemove =function (e) {
        moveAt(e);
    }

    ball.onmouseup= function(){
        document.onmousemove = null;
        ball.onmouseup=null;
    }

  
}
ball.ondragstart = function() {
    return false;
  };
  function getCoords(elem) {   // кроме IE8-
    var box = elem.getBoundingClientRect();
    return {
      top: box.top + pageYOffset,
      left: box.left + pageXOffset
    };
  }
<img src="https://isplit.ru/image/cache/data/brendy/Leco/street_plus_300_h_200_sm/street_plus_300_h_200_sm_1-630x630-0.jpg" alt="" srcset=""  width="200" height="200">


  <img src="https://st.depositphotos.com/1000459/2436/i/450/depositphotos_24366251-stock-photo-soccer-ball.jpg" alt="" srcset="" id="ball" width="100" height="100">

javascript
Martin Hope
recile
Asked: 2020-01-19 03:00:11 +0000 UTC
  • 0

这样两行之间就有某种填充颜色 

const canvas = document.getElementById("can");
const context = canvas.getContext('2d');
context.beginPath();
context.lineWidth=2;
context.moveTo(150,50);
context.lineTo(150,150);







context.lineWidth=2;
context.moveTo(250,50);
context.lineTo(250,150);
context.stroke();
width: 400px;
  height: 200px;
  border: 3px solid black;
  margin: 40px;
<canvas id="can" width="400" height="200"></canvas>

javascript
Martin Hope
recile
Asked: 2020-01-16 19:58:44 +0000 UTC
  • 0

帮助将添加类更改为选中

var inputText= document.getElementById("inputText");
var hideShow= document.getElementById("hideShow");

ButtonAdd.addEventListener("click", function(e) {
  var inputText = document.getElementById("inputText");
  var list = document.getElementById('list');

  var check = document.createElement("input");
  check.type = "checkbox";
  check.addEventListener("click", function(e) {
    console.log(text.textContent);
  });

  var text = document.createElement("span");
  text.textContent = inputText.value;

  var label1 = document.createElement('label');

  label1.appendChild(check);
  label1.appendChild(text);
  list.appendChild(label1);
});

hideShow.addEventListener("click", function(e) {
  var checks = document.querySelectorAll("#list input[type=checkbox]:checked");
  checks.forEach(item => item.parentNode.parentNode.className="hides");
});
.hides{
    display: none;
  }
<ul id="list">
        <label class="hides">
<input type="checkbox"><span>dsfd</span>
        </label>
</ul>
<input type="text" name="" id="inputText">
<button id="hideShow">hide selected</button>
<button id="ButtonAdd">Add</button>

javascript
Martin Hope
recile
Asked: 2020-01-16 04:04:58 +0000 UTC
  • 2

如何修复以便将 for 也添加到标签中，如果复选标记值得进一步编写事件，则会发生检查 

var inputText= document.getElementById("inputText");
var ButtonAdd= document.getElementById("ButtonAdd");
var list = document.getElementById('list');
var eledd= document.querySelectorAll('input[type=checkbox]');
var bRemove= document.getElementById("buttonRemove");
ButtonAdd.onclick = function(){
  var inputcheck = document.createElement("input");
  inputcheck.id="fff";
  inputcheck.type ="checkbox";

 var label1= document.createElement('label');


  label1.innerHTML=inputText.value;
  list.appendChild(inputcheck);
  list.appendChild(label1);

}

if (eledd.checked){
alert("1");
}
<ul id="list"></ul>
<input type="text" name="" id="inputText" > 
<button id="ButtonAdd">Add</button>
<button id="bRemove">Remove</button>

javascript
Martin Hope
recile
Asked: 2020-01-13 22:11:26 +0000 UTC
  • 1

它似乎有效但不适用于setTimeout，圆圈应该绕一圈旋转，请帮助。如果您删除setTimeout 它，它会起作用。

var centerx = 400,
  centery = 450,
  radius = 150;
//var a=0;
function muvi(a) {


  while (a < 6.28) {

    a = a + 0.1;
    let x = (radius * Math.cos(a)) + centerx;
    let y = (radius * Math.sin(a)) + centery;
    console.log(a);
    let div = document.getElementById('roundid');
    div.style.left = x + "px";
    div.style.top = y + "px";
    document.body.appendChild(div);

    (function() {
      let j = a;
      setTimeout(function timer() {
        console.log(j);

      }, 100);
    })();

  }
}
muvi(0);
#block {
  position: absolute;
  width: 30px;
  height: 30px;
  background: #fcc;
}

body {
  position: relative;
}

.round,
#roundid {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: red;
  position: absolute;
}
<div id="roundid" class="round"></div>

javascript