var sliderNav = document.getElementById('sliderNav');
var paraIns = new Parallax(sliderNav);
var thumbs = document.querySelectorAll('.thumbnail');
thumbs[3].classList.add('active');
for (var i = 0; i < thumbs.length; i++) {
thumbs[i].addEventListener('mouseover', function() {
console.log(!!this.previousElementSibling, !!this.nextElementSibling);
});
}
html,
body {
margin: 0;
}
.slider {
background-color: darkgray;
width: 100%;
height: 400px;
position: relative;
margin-bottom: 1200px;
}
.slider__navigation {
pointer-events: unset !important;
z-index: 1;
position: absolute;
bottom: 0;
right: 0;
left: 0;
margin: auto;
width: 1200px;
height: 240px;
}
.slider__navigation .thumbnail {
display: inline-block;
width: 14%;
height: 240px;
float: left;
padding: 20px;
z-index: 2;
}
.slider__navigation .thumbnail .thumbnail__img {
-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);
-moz-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);
width: 100%;
height: 100%;
transition: all 0.3s ease-in-out;
background: lightgray;
transform: scale(0.7);
}
.slider__navigation .thumbnail:nth-child(2) {
left: 13% !important;
}
.slider__navigation .thumbnail:nth-child(3) {
left: 27% !important;
}
.slider__navigation .thumbnail:nth-child(4) {
z-index: 5;
left: 0;
right: 0;
margin: 0 auto;
}
.slider__navigation .thumbnail:nth-child(5) {
left: 56% !important;
}
.slider__navigation .thumbnail:nth-child(6) {
left: 71% !important;
}
.slider__navigation .thumbnail:nth-child(7) {
left: 84% !important;
}
.slider__navigation .thumbnail:nth-child(3),
.slider__navigation .thumbnail:nth-child(5) {
z-index: 4;
}
.slider__navigation .thumbnail:nth-child(2),
.slider__navigation .thumbnail:nth-child(6) {
z-index: 3;
}
.slider__navigation .thumbnail.active {
z-index: 5;
}
.slider__navigation .thumbnail.active .thumbnail__img {
transform: scale(1);
}
.slider__navigation .thumbnail.adjacent {
z-index: 4;
}
.slider__navigation .thumbnail.adjacent .thumbnail__img {
transform: scale(0.9);
}
.slider__navigation .thumbnail.adjacentx2 {
z-index: 3;
}
.slider__navigation .thumbnail.adjacentx2 .thumbnail__img {
transform: scale(0.8);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/parallax/3.1.0/parallax.min.js"></script>
<div class="slider">
<div id="sliderNav" class="slider__navigation" data-relative-input="true">
<a href="#" class="thumbnail" data-depth="0.2">
<div class="thumbnail__img"></div>
</a>
<a href="#" class="thumbnail" data-depth="0.4">
<div class="thumbnail__img"></div>
</a>
<a href="#" class="thumbnail" data-depth="0.6">
<div class="thumbnail__img"></div>
</a>
<a href="#" class="thumbnail" data-depth="0.8">
<div class="thumbnail__img"></div>
</a>
<a href="#" class="thumbnail" data-depth="0.6">
<div class="thumbnail__img"></div>
</a>
<a href="#" class="thumbnail" data-depth="0.4">
<div class="thumbnail__img"></div>
</a>
<a href="#" class="thumbnail" data-depth="0.2">
<div class="thumbnail__img"></div>
</a>
</div>
</div>
Первый / последний элементы не имеют элемента previousElementSibling / nextElementSibling. смотрите журналы консоли, когда вы наводите курсор на элементы.
Мне довольно везло, сохраняя мои файлы под системой управления версиями. Это не для всех, но большинство программистов должно быть в состоянии ценить преимущества. Читайте
для превосходного описания, включая то, как обработать non-dotfile конфигурацию (как задания крона через svnfix сценарий ) на нескольких машинах.
портфель - это инструмент для облегчения хранения файлов точек в git, включая файлы с личной информацией (например, .gitconfig).
Сохраняя свои файлы конфигурации в публичном git-репозитории git, вы можете делиться своими настройками с другими. Любая секретная информация хранится в одном файле за пределами репозитория (вы можете сделать резервную копию и перенести этот файл).
Разговор о том, чтобы хранить точечные файлы на публике существует
и
, Но это было бы действительно болезненно для ручного обновления файлов как (AFAIK), ни один из этих сервисов не обеспечивает API.
последний является действительно минималистическим (никакая форма контакта, никакая информация о том, кто делал/владел его и т.д.)
В зависимости от вашей среды вы также можете использовать (полностью резервные копии) общие ресурсы NFS ...
Теперь я использую Live Mesh , который поддерживает синхронизацию всех моих файлов на нескольких машинах.
Svn здесь, также. Rsync или унисон были бы хорошей идеей, за исключением того, что иногда материал прекращает работать, и я задаюсь вопросом, что было в моем .bashrc файле на прошлой неделе. Svn является жизненным средством сохранения в этом случае.
Существует netskel, куда Вы помещаете свои общие файлы на веб-сервер, и затем клиентская программа поддерживает точечные файлы на любом количестве клиентских машин. Это разработано для работы любого уровня клиентской машины, таким образом, сценарии оболочки надлежащие sh
сценарии и имеют минимальную сумму зависимостей.
Я сохраняю основные версии файлов под управлением CM на моей основной машине, и где я должен, расположите скопировать обновления вокруг. К счастью, у нас есть NFS, монтируется для корневых каталогов на большинстве наших машин, таким образом, я на самом деле не должен копировать все настолько часто. Мой профиль, с другой стороны, довольно сложен - и имеет условие для различных настроек PATH, и т.д., на различных машинах. Примерно, машины, я имею административный контроль, имеют тенденцию иметь больше программного обеспечения с открытым исходным кодом, установленного, чем машины, которые я иногда использую без административного управления.
Так, у меня есть случайное соединение ручного и полуавтоматического процесса.
Я храню мой в репозитории git
, что позволяет мне легко объединяться за пределы системных зависимых изменений, но также делиться изменениями, которые я тоже хочу.
я использую svn... имеющий общественность и частный репозиторий... поэтому, как только я вхожу в сервер i всего
svn co http://my.rep/home/public
и имею все мои точечные файлы...
Вы могли использовать rsync. Это работает через ssh, который я нашел полезными, так как я только устанавливаю новые серверы с ssh доступом.
Или, создайте файл tar, который Вы перемещаете везде и распаковываете.
Я бы определенно рекомендовал тоску по дому . Он использует Git и автоматически символические ссылки на ваши файлы. homesick track
отслеживает новый файл точек, в то время как homesick symlink
символически связывает новые файлы точек из хранилища в вашу домашнюю папку. Таким образом, вы даже можете иметь более одного хранилища.
Rsync о вашем лучшем решении. Примеры можно найти здесь:
Это походит везде, что я смотрю в эти дни, я нахожу новую вещь, которая заставляет меня сказать "Эй, это было бы хорошей вещью использовать DropBox для"
Я также использую Subversion для управления моими точечными файлами. Когда я вхожу в систему, мои confs автоматически обновляются для меня. Я также использую github для публичного хранения моих confs . Я использую git-svn для их синхронизации.
Чтобы начать работу на новом сервере, достаточно выполнить несколько команд. Скрипт create_links просто создает символические ссылки из элементов папки .dotfiles в мой $ HOME
, а также затрагивает некоторые файлы, которые не нужно регистрировать.
$ cd
# checkout the files
$ svn co https://path/to/my/dotfiles/trunk .dotfiles
# remove any files that might be in the way
$ .dotfiles/create_links.sh unlink
# create the symlinks and other random tasks needed for setup
$ .dotfiles/create_links.sh