编辑5月26日:
我使用编码你会在下面看到来自@AchrafJEDAY的答案(我也会在这里也包含它)。编码因某种方式而破坏,当我点击日期或标签按钮显示任何帖子的日期或标签时,它就吓坏了;在整个页面刷新之前,你会看到它#34; /?"在URL的末尾,日期和标签都再次隐藏。我不确定为什么会这样,但我非常感谢任何人的帮助!谢谢!!
CODING:
CSS
.postdatebutton{
float:left;
position:relative;
top:0px;
left:0px;
width:50px;
height:15px;
border:1px #83174C solid;
background-color:rgba(255, 230, 240, 0.8);
font-family: 'Indie Flower', cursive;
letter-spacing:2px;
text-align:center;
padding-top:5px;
color:black;
font-size:14px;
text-decoration:underline;
}
.postdatebutton button{
font-family: 'Indie Flower', cursive;
text-decoration:underline;
}
.postdate{
width: 100%;
text-align: center;
display:none;
}
/*TAGS*/
.tags {
width:415px;
text-transform:uppercase;
line-height:120%;
font-size:15px;
text-align:center;
padding:2px;
text-decoration:underline;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}
.tags a {
color:#BB0B20;
letter-spacing:1px;
padding:1px;
}
.posttagbutton{
float:left;
position:relative;
top:0px;
left:0px;
width:50px;
height:15px;
border:1px #83174C solid;
background-color:rgba(255, 230, 240, 0.8);
font-family: 'Indie Flower', cursive;
letter-spacing:2px;
text-align:center;
padding-top:5px;
color:black;
font-size:14px;
text-decoration:underline;
}
.posttagbutton button{
font-family: 'Indie Flower', cursive;
text-decoration:underline;
}
.posttag {
width: 100%;
text-align: center;
display:none;
}
#stuff table{
position:relative;
width:100%;
text-align:center;
}
HTML
<table>
<tbody>
<tr>
<!---LIKE---->
<td><div class="postlike">{LikeButton}</div> </td>
<!---REBLOG---->
<td><div id="postreblog"><a href="{ReblogURL}">Reblog</a></div> </td>
<!---NOTES---->
<td><div class="postnote">{block:NoteCount} <a href="{Permalink}">Notes</a>{/block:NoteCount}</div> </td>
<!---VIA---->
<td><div class="postfrom">{block:RebloggedFrom}<a href="{ReblogParentURL}">From</a>{/block:RebloggedFrom}</div> </td>
<!---SOURCE---->
<td><div class="postsource"> {block:ContentSource}<a href="{SourceURL}">Orig-Poster</a>{/block:ContentSource}</div> </td>
<!---DATE BUTTON---->
<td><div class="postdatebutton"><button onclick="myFunction6(this)">Date</button></div></td>
<!---TAGS BUTTON---->
<td><div class="posttagbutton"><button onclick="myFunction7(this)">Tags</button></div></td></tr></tbody></table>
<!---HIDDEN DATE---->
<div class="postdate" style="display:none;"><p>{block:Date}<a href="{Permalink}"> {MonthNumberWithZero}-{DayOfMonthWithZero} {24Hour}:{Minutes}</a>{/block:Date}</p></div>
<!---HIDDEN TAGS---->
<div class="posttag" style="display:none;"><div class="tags"><p>{block:Tags}<a href="{TagURL}"># {Tag}</a>{/block:Tags}</p></div></div>
JS
<!---SCRIPT FOR DATE AND TAGS---->
<script>
function myFunction6 ( event ) {
var node = event.parentNode;
for (i = 0; i < 5; i++) {
node = node.parentNode;
}
var x = node.getElementsByClassName("postdate");
if (x[0].style.display === 'block') {
x[0].style["display"] = "none";
}
else {
x[0].style["display"] = "block";
}
}
</script>
<script>
function myFunction7( event ) {
var node = event.parentNode;
for (i = 0; i < 5; i++) {
node = node.parentNode;
}
var x = node.getElementsByClassName("posttag");
if (x[0].style.display === 'block') {
x[0].style.display = 'none';
}
else {
x[0].style.display = 'block';
}
}
</script>
答案 0 :(得分:1)
function myFunction1 ( event ) {
var node = event.parentNode;
for (i = 0; i < 5; i++) {
node = node.parentNode;
}
var x = node.getElementsByClassName("postdate");
if (x[0].style.display === 'block') {
x[0].style["display"] = "none";
}
else {
x[0].style["display"] = "block";
}
}
function myFunction2( event ) {
var node = event.parentNode;
for (i = 0; i < 5; i++) {
node = node.parentNode;
}
var x = node.getElementsByClassName("posttag");
if (x[0].style.display === 'block') {
x[0].style.display = 'none';
}
else {
x[0].style.display = 'block';
}
}
&#13;
<div id="stuff"><div class="picsize"><div class="textpost"><h3> Testing Text Post - Title </h3><p><span><a href="http://allystestblog1818.tumblr.com/post/159609010143">allystestblog1818</a></span>:</p><blockquote><h2>Headline</h2><h2><b>Headline Bold</b></h2><h2><i>Headline Italic</i></h2><p><b>Bold text,</b> <i>Italic text,</i> <span><a href="http://allystestblog1818.tumblr.com/">Link text</a></span></p><ol><li>Numbered <br></li><li>List<br></li></ol><ul><li>Bullet<br></li><li>List<br></li></ul><blockquote><p>Indented text</p></blockquote><p>Regular text</p><p>Line break<br></p><hr><p>Picture</p><figure class="tmblr-full"><img src="https://68.media.tumblr.com/1250d273b9e9b4860d73aa893361ec20/tumblr_inline_oogr5xEk1J1txz9li_540.jpg" class=""></figure><p class=""><span><a href="http://allystestblog1818.tumblr.com/post/159609010143/testing-text-post-title" class="tmblr-truncated-link read_more">Keep reading</a></span></p></blockquote></div></div><div class="picsize"></div><p></p><table><tbody><tr><td><div class="postlike"><div class="like_button" data-post-id="160506016653" data-blog-name="wisdomsprydethemetestblog" id="like_button_160506016653"><iframe id="like_iframe_160506016653" src="https://assets.tumblr.com/assets/html/like_iframe.html?_v=5716f9145cbbcc5e21aa13229de5d4ed#name=wisdomsprydethemetestblog&post_id=160506016653&color=black&rk=4ktb4Bma&root_id=159609010143" scrolling="no" width="20" height="20" frameborder="0" class="like_toggle" allowtransparency="true" name="like_iframe_160506016653"></iframe></div></div> </td><td><div id="postreblog"><a href="https://www.tumblr.com/reblog/160506016653/4ktb4Bma">Reblog</a></div> </td><td><div class="postnote"> <a href="https://wisdomsprydethemetestblog.tumblr.com/post/160506016653/testing-text-post-title">Notes</a></div> </td><td><div class="postfrom"><a href="https://pokemonthemetestblog.tumblr.com/post/159612507917/testing-text-post-title">From</a></div> </td><td><div class="postsource"> <a href="http://allystestblog1818.tumblr.com/post/159609010143/testing-text-post-title">Orig-Poster</a></div> </td><td><div class="postdatebutton"><button onclick="myFunction1(this)">Date</button></div></td><td><div class="posttagbutton"><button onclick="myFunction2(this)">Tags</button></div></td></tr></tbody></table><div class="postdate" style="display:none;"><p><a href="https://wisdomsprydethemetestblog.tumblr.com/post/160506016653/testing-text-post-title">05-10 1:52</a></p></div><div class="posttag" style="display:none;"><div class="tags"><p><a href="https://wisdomsprydethemetestblog.tumblr.com/tagged/Test-text-post"># Test text post</a><a href="https://wisdomsprydethemetestblog.tumblr.com/tagged/tags-tags-tags"># tags tags tags</a></p></div></div>
</div>
&#13;