var img = document.getElementById('myImg');
<img class ="myImg" src="img_snow.jpg" alt="Snow" style="width:100%;max-width:300px">
<img class ="myImg" src="img_snow.jpg" alt="Snow" style="width:100%;max-width:300px">
<!-- The Modal -->
<div id="myModal" class="modal">
<span class="close">×</span>
<img class="modal-content" id="img01">
<div id="caption"></div>
</div>
var modalImg = document.getElementById("img01");
var captionText = document.getElementById("caption");
var imgs = document.querySelectorAll('.myImg');
imgs.forEach(img) {
img.onclick = function(){
modal.style.display = "block";
modalImg.src = this.src;
captionText.innerHTML = this.alt;
}
const animItems = document.querySelectorAll(`._anim-items`)
if (animItems.length > 0) {
window.addEventListener(`scroll`, animOnScroll)
function animOnScroll() {
for (let index = 0; index < animItems.length; index++) {
const animItem = animItems[index]
const animItemHeight = animItem.offsetHeight
const animItemOffSet = offset(animItem).top
const animStart = 4
let animItemPoint = window.innerHeight - animItemHeight / animStart
if (animItemHeight > window.innerHeight) {
animItemPoint = window.innerHeight - window.innerHeight / animStart
}
if ((pageYOffset > animItemOffSet - animItemPoint) && pageYOffset < (animItemOffSet + animItemHeight)) {
animItem.classList.add(`_active`)
} else {
if (!(animItem.classList.contains(`_anim-no-hide`))) {
animItem.classList.remove(`_active`)
}
}
}
}
function offset(el) {
const rect = el.getBoundingClientRect()
let scrollLeft = window.pageXOffset || document.documentElement.scrollLeft
let scrollTop = window.pageYOffset || document.documentElement.scrollTop
return {top: rect.top + scrollTop, left: rect.left + scrollLeft}
}
setTimeout(() => {
animOnScroll()
}, 300)
}
.header {
transform: translate(0, -80%);
opacity: 0.5;
transition: all 1s ease 0s;
}
.header._active {
transform: translate(0, 0);
opacity: 1;
}
#include <iostream>
using namespace std;
int main() {
for(int i = 1; i < 20; i++) {
cout << i*i << ' ';
}
}
Изучил html, css процентов так на 70.это еще не тот уровень, который даст Вам возможность быть востребованным на фриласнсе, кроме того что такое 70%? Это Ваше субъективное мнение, покажите работ 10 сверстанных Вами, и я скажу насколько Вы готовы.
Когда я доучу JS - могу идти верстать за зелёные?вы может даже сейчас идти себя пробовать на фрилансе, но понятно не за зеленные, а за деревянные и начинать с мелких подработок. Поверьте, даже если Вы изучите все на 100% на бирже Вы полный ноль без завршенных проектов, и что бы набить себе рейтинг, Вам придется очень много всякой мелочи сверстать за гроши. Никто новичку не даст проект в работу, это 100%.
и можно ли такое осуществить?
как в бутстрапе 4 создать вертикальный слайдер