0
블로그 웹 사이트 Tumblr에서 레이아웃을 사용하고 있습니다. Show All 기능에서 "Childhood Influences"카테고리를 삭제하고 싶습니다. 나는 단지 첫 페이지에서 그것을 제거 할 수 있었지만, 그 탭을 클릭했을 때만 Childhood Influences가 나타나기를 바랍니다. 여기에 코드입니다 : jQuery : 모두 표시 옵션에서 카테고리를 숨기려면 어떻게합니까?
<!--
CURRENTLY WATCHING #2
pistachi-o (nutty-themes @ tumblr)
Theme Documentation:
http://nutty-themes.tumblr.com/themedoc
Please Do Not:
http://nutty-themes.tumblr.com/terms
-->
<head>
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="altertnate" type="application/rss+xml" href="{RSS}">
<meta name="description" content="" />
<meta http-equiv="x-dns-prefetch-control" content="off"/>
<link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300' rel='stylesheet' type='text/css'>
<style type="text/css">
/* Reset ----------------------------- */
body,div,dl,dt,dd,ol,ul,li,pre,form,fieldset,input,textarea,p,th,td {margin:0;padding:0;}
/* Scrollbar ----------------------------- */
::-webkit-scrollbar {width: 6px;}
::-webkit-scrollbar-track {background: #FFF;}
::-webkit-scrollbar-thumb {background: #DDD;}
/* General ----------------------------- */
body {
background: #f3f3f3;
font-size: 10px;
color: #000000;
font-family: 'Roboto Condensed', Arial, sans-serif;
line-height: 100%;
}
a:link, a:active, a:visited {
color: #130912;
text-decoration: none;
}
a:hover {
color: #f38335;
text-decoration: none;
}
b {
color: #f7941d;
text-decoration: none;
}
/* Isotope (DO NOT EDIT) ----------------------------- */
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
.isotope,
.isotope .isotope-item {
-webkit-hiatus-duration: 0.8s;
-moz-hiatus-duration: 0.8s;
hiatus-duration: 0.8s;
}
.isotope {
-webkit-hiatus-property: height, width;
-moz-hiatus-property: height, width;
hiatus-property: height, width;
}
.isotope .isotope-item {
-webkit-hiatus-property: -webkit-transform, opacity;
-moz-hiatus-property: -moz-transform, opacity;
hiatus-property: transform, opacity;
}
/* Navigation ----------------------------- */
#shows {
position: relative;
width: 100%;
height: 10px;
margin: 0px auto 10px;
background: blue;
padding: 15px 0px;
background: #fafafa;
text-align: center;
}
/* Contents ----------------------------- */
#container {
width: 840px;
position: relative;
text-align: center;
margin: 50px auto;
}
#containers {
width: 840px;
position: relative;
text-align: center;
margin: 50px auto;
}
#nextcontainer {
width: 840px;
position: relative;
text-align: center;
margin: 50px auto;
}
#nextcontainers {
width: 840px;
position: relative;
text-align: center;
margin: 50px auto;
}
.stylewrap {
background: #edd456;
width: 200px;
height: 165px;
margin: 5px;
text-align: center;
text-transform: uppercase;
}
.hiatus {
background: #a0c1ba;
}
.complete {
background: #45c0ab;
}
.childhood {
background: #e3e3e3;
}
.next {
background: #c6c6c6;
}
.stylewrap img {
margin: 0;
width: 200px;
border-bottom: 2px solid #F3F3F3;
}
h2 {
margin: 10px 0px 3px;
line-height: 100%;
}
#filters {
text-transform: uppercase;
}
#filters li {
display: inline;
margin: 2px;
padding: 2px 5px;
}
#dash {
text-transform: uppercase;
margin: 25px;
}
#dash li {
display: inline;
margin: 2px;
padding: 2px 5px;
}
.stylewrap:hover .grey {
filter: none;
-webkit-filter: grayscale(0%);
}
</style>
</head>
<body>
<div id="shows">
<ul id="filters" class="show-set clearfix" data-option-key="filter">
<li style="background: #f5f5f5;"><a href="#filter" data-option-value="*" class="selected">Show All</a></li>
<li style="background: #f5f5f5;"><a href="#filter" data-option-value=".current">Currently Watching</a></li>
<li style="background: #f5f5f5;"><a href="#filter" data-option-value=".hiatus">On Hiatus</a></li>
<li style="background: #f5f5f5;"><a href="#filter" data-option-value=".complete">Completed</a></li>
<li style="background: #f5f5f5;"><a href="#filter" data-option-value=".next">Next Up</a></li>
<li style="background: #f5f5f5;"><a href="#filter" data-option-value=".childhood">Childhood Influences</a></a></li>
</ul>
<ul id="dash">
<li><a href="/">Back Home</a></li>
<li><a href="http://tumblr.com/dashboard">Dashboard</a></li>
<li><a href="http://nutty-themes.tumblr.com/">Theme Credits</a></li>
</ul>
</div>
<div id="container">
<!-- To add completed show copy and paste the following -->
<div class="stylewrap next">
<img class="grey" src="http://imgur.com/Bktk9mC.jpg">
<h2 class="name"><a href="/tagged/">6teen</a></h2>
Up Next
</div>
<!-- End of Complete Show -->
<div class="stylewrap current">
<img class="grey" src="http://imgur.com/IO7NGnK.jpg" />
<h2 class="name"><a href="/tagged/18_to_life">18 to Life</a></h2>
Season 2 Episode 11
</div>
<div class="stylewrap childhood">
<img class="grey" src="http://imgur.com/NTMO0xq.jpg">
<h2 class="name"><a href="/tagged/">7th Heaven</a></h2>
(1996-2007)
</div>
<!-- To add completed show copy and paste the following -->
<div class="stylewrap complete">
<img class="grey" src="http://imgur.com/vPkxn7c.jpg">
<h2 class="name"><a href="/tagged/">About a Girl</a></h2>
(2007-2008)
</div>
<!-- End of Complete Show -->
<!-- To add hiatus show copy and paste the following -->
<div class="stylewrap hiatus">
<img class="grey" src="http://imgur.com/owiMXh5.jpg">
<h2 class="name"><a href="/tagged/">Awkward.</a></h2>
Returning September 23, 2014
</div>
<!-- End of Hiatus Show -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/whx9ghv/1eGm9d17y/isotope.js"></script>
<script type="text/javascript">
$(function(){
var $container = $('#container');
$container.isotope({
itemSelector : '.stylewrap',
filter: '.current, .hiatus, .next, .complete',
getSortData : {
name : function ($elem) {
return $elem.find('.name').text();
}
}
});
var $optionSets = $('#shows .show-set'),
$optionLinks = $optionSets.find('a');
$optionLinks.click(function(){
var $this = $(this);
// don't proceed if already selected
if ($this.hasClass('selected')) {
return false;
}
var $optionSet = $this.parents('.show-set');
$optionSet.find('.selected').removeClass('selected');
$this.addClass('selected');
// make option object dynamically, i.e. { filter: '.my-filter-class' }
var options = {},
key = $optionSet.attr('data-option-key'),
value = $this.attr('data-option-value');
// parse 'false' as false boolean
value = value === 'false' ? false : value;
options[ key ] = value;
if (key === 'layoutMode' && typeof changeLayoutMode === 'function') {
// changes in layout modes need extra logic
changeLayoutMode($this, options)
} else {
// otherwise, apply new options
$container.isotope(options);
filter: '.current, .hiatus, .next, .complete';
}
return false;
});
});
</script>
</body>
</html>
나는 문제가 jQuery를에 생각하지만, 난 그냥 그것을 알아낼 수 없습니다. 나는 이것에 2 일을 보냈지 만 너무 진보하지 않아서 나는 대답 할 수있는 모든 곳을 찾고있었습니다.
편집 : 불명확합니다. 문제가 해결되었습니다!
답변을 추가했지만 지금까지 무엇을했는지 데모하지 않고 무엇을 하려는지 짐작하기가 어렵습니다. 수정할 콘텐츠에 대한 링크가 있습니까? 그리고 정확히 무엇을하려고하는지 더 잘 묘사 할 수 있습니까? –
이 시점에서 여러 가지 답변을 받으 셨습니다. 그들 중 한 명이 올바르게 문제를 해결하면 문제 옆에있는 체크 표시를 클릭하여 문제를 답변으로 표시하십시오. 그렇지 않으면 일부가 만족스럽지 않은 경우 답변에 댓글을 달거나 질문을 편집 한 경우 도움이됩니다. – Serlite