$(elem).offset().top; // top от документа
$(elem).position().top; // top от родителяvar top = elem.getBoundingClientRect().top + document.body.scrollTop;
$prod_cat_args = array(
'taxonomy' => 'product_cat',
'orderby' => 'id', // здесь по какому полю сортировать
'hide_empty' => false, // скрывать категории без товаров или нет
'parent' => 0 // id родительской категории
);
$woo_categories = get_categories( $prod_cat_args );
foreach ( $woo_categories as $woo_cat ) {
$woo_cat_id = $woo_cat->term_id; //category ID
$woo_cat_name = $woo_cat->name; //category name
$woo_cat_slug = $woo_cat->slug; //category slug
echo '<div class="main-cat-item">';
$category_thumbnail_id = get_woocommerce_term_meta($woo_cat_id, 'thumbnail_id', true);
$thumbnail_image_url = wp_get_attachment_url($category_thumbnail_id);
echo '<img src="' . $thumbnail_image_url . '"/>';
echo '<h2>';
echo '<a href="' . get_term_link( $woo_cat_id, 'product_cat' ) . '">' . $woo_cat_name . '</a>;
echo '</h2>';
echo "</div>\n";
}SCSS:
.main-cat-item {
padding: 1em;
position: relative;
h2 {
font-size: 2em;
position: absolute;
bottom: 0;
right: 0;
padding: 1.5em 1.5em;
text-shadow: 0 1px 8px black;
a {
color: white;
}
}
}
display: grid + подложка на svg и медиа-запросами переключать подложки.
Пару лет назад начал изучать веб, вот казалось, всё идёт по маслу, изучил HTML, затем CSS, и естественно настала очередь JS. И вот тут уже начались трудности
В итоге я начал медленно прекращать изучать его, потому что в мою юношескую голову, после наступления трудности( да, я знаю что JS — не самый сложный язык ),
начали закладываться мысли, что после моего успешного выпуска, таких программистов как я, будет, мягко говоря, много
Многие компании, насколько я знаю, заинтересованны в твоем непосредственном дипломе.
И что уж говорить о европейских странах, Норвегии, США и т.д? Получить там работу без вышки ты попросту не сможешь, каким бы ты невероятно талантливым и умелым не был.
Для чего просиживаете на тостере по 5-6 часов в день?
@-webkit-keyframes autofill {
to {
color: #000;
background: transparent;
}
}
input:-webkit-autofill {
-webkit-animation-name: autofill;
-webkit-animation-fill-mode: both;
}input[placeholder] {text-overflow:ellipsis;}
input::-moz-placeholder {text-overflow:ellipsis;}
input:-moz-placeholder {text-overflow:ellipsis;}
input:-ms-input-placeholder {text-overflow:ellipsis;}:focus::-webkit-input-placeholder {color: transparent}
:focus::-moz-placeholder {color: transparent}
:focus:-moz-placeholder {color: transparent}
:focus:-ms-input-placeholder {color: transparent}label {
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}textarea {
resize: vertical;
}address {
font-style: normal;
}input:focus,
textarea:focus {
outline: none;
}img {
height: auto;
max-width: 100%;
width: auto\9;
}.video {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.video iframe,
.video object,
.video embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}.break-word {
word-wrap: break-word;
}ul {
list-style: none;
margin: 0;
padding: 0;
}ol {
counter-reset: list1;
li:before {
counter-increment: list1;
content: counter(list1) '. ';
}
ol {
counter-reset: list2;
li:before {
counter-increment: list2;
content: counter(list1) '.' counter(list2) '. ';
}
ol {
counter-reset: list3;
li:before {
counter-increment: list3;
content: counter(list1) '.' counter(list2) '.' counter(list3) '. ';
}
}
}
}
$("body").on('click', '[href*="#"]', function(e){
var fixed_offset = 100;
$('html,body').stop().animate({ scrollTop: $(this.hash).offset().top - fixed_offset }, 1000);
e.preventDefault();
});
Какие используете единицы измерения при верстке?
