loading

ํ‹ฐ์Šคํ† ๋ฆฌ Portfolio ์Šคํ‚จ ํŽ˜์ด์ง€ ๋ฐ ๊ณต์ง€์‚ฌํ•ญ ์ƒ๋‹จ ๋ ˆ์ด์•„์›ƒ ๊นจ์ง ์ˆ˜์ •ํ•˜๊ธฐ

2020. 12. 3. 14:31ใ†IT

ํ‹ฐ์Šคํ† ๋ฆฌ ๊ธฐ๋ณธ ์ œ๊ณต ์Šคํ‚จ์ธ ํฌํŠธํด๋ฆฌ์˜ค (https://www.tistory.com/skin/xf_Portfolio)

 

๊ณผ๊ฑฐ ์Šคํ‚จ์˜ ์ด์Šˆ์˜€๋Š”์ง€๋Š” ๋ชจ๋ฅด๊ฒ ์œผ๋‚˜, ํ˜„์žฌ ์‚ฌ์šฉ์ค‘์ธ ํ‹ฐ์Šคํ† ๋ฆฌ Portfolio ์Šคํ‚จ์˜ ๊ฒฝ์šฐ, ์ƒ๋‹จ ์ด๋ฏธ์ง€๊ฐ€ ํฌํ•จ๋˜์ง€ ์•Š๋Š” ๊ณต์ง€์‚ฌํ•ญ ๋ฐ ํŽ˜์ด์ง€์—์„œ๋Š” ๋ ˆ์ด์•„์›ƒ์ด ๊นจ์ ธ์„œ ํ‘œ์‹œ๋œ๋‹ค.

ํ—ค๋”์— jQuery ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋„ฃ์–ด์ฃผ๊ณ , ๋ณธ๋ฌธ ์ตœํ•˜๋‹จ์— ์•„๋ž˜ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋„ฃ์–ด์ฃผ๋ฉด ์›ํ•˜๋Š” ํ˜•ํƒœ๋กœ ์ œ๋ชฉ ๋ฐ ๋‚ ์งœ ๋ถ€๋ถ„์„ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋‹ค.

 

<script>
    if ($(document).has('.inner_header').length > 0) {
        if ($('.inner_header').css('background-image').split(/"/)[1] === document.URL) {
        $('.article_header').css('opacity', 0);
        $('.article_view .tt_article_useless_p_margin').before('<div class="hidden_title">' + $('.article_header .info_text .title_post').text() + '</div><div class="hidden_date">' + $('.article_header .info_text .info .date').text() + '</div>');
    }
}
</script>

 

CSS๋Š” ์ทจํ–ฅ์— ๋”ฐ๋ผ์„œ ๋ฐฐ์น˜ํ•˜๋ฉด ๋œ๋‹ค.

 

.hidden_title {
    position: relative;
    width: 100%;
    margin: 120px 0 0 0; font-size: 20px;
    font-weight: 600; color: #333;
}

@media screen and (max-width:1023px) {
    .hidden_title {
        margin: 0 !important;
    }
}

.hidden_date {
    position: relative;
    width: 100%;
    margin: 10px 0 40px 0;
    font-size: 13px;
    font-weight: 300;
    color: #999;
    letter-spacing: -0.02em;
}

 

์ตœ๊ทผ์—” ์ˆ˜์ •์ด ๋˜์—ˆ๋Š”์ง€ ์ž˜ ๋ชจ๋ฅด๊ฒ ๋‹ค. ์›Œ๋‚™ ์˜ค๋ž˜์ „์— ์ ์šฉํ•œ ์Šคํ‚จ์ด๋ผ..

์ˆ˜์ •๋œ ๋ ˆ์ด์•„์›ƒ ์‚ดํŽด๋ณด๊ธฐ