Mustafa Gaziani
Reputation: 87
jQuery not responding for first paragraph hiding
Hi I am using jQuery in my blogger blog to split my content. It works fine but it always shows the 1st paragraph of post on every page and its no hiding the 1st paragraph.
I have followed this link to include my jQuery. And here is my blog-post
The "Tip:1" paragraph of my post is always shown while others are working as I want. Please let me know the issue, If I am missing something.
EDITED:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script style="text/javascript">
jQuery(document).ready(function(){
jQuery('.page1').click(function(){
jQuery('.content1').show();
jQuery('.content2').hide();
jQuery('.content3').hide();
jQuery('.content4').hide();
jQuery('.content5').hide();
jQuery('.content6').hide();
return false;
});
jQuery('.page2').click(function(){
jQuery('.content2').show();
jQuery('.content1').hide();
jQuery('.content3').hide();
jQuery('.content4').hide();
jQuery('.content5').hide();
jQuery('.content6').hide();
return false;
});
jQuery('.page3').click(function(){
jQuery('.content1').hide();
jQuery('.content2').hide();
jQuery('.content3').show();
jQuery('.content4').hide();
jQuery('.content5').hide();
jQuery('.content6').hide();
return false;
});
jQuery('.page4').click(function(){
jQuery('.content1').hide();
jQuery('.content2').hide();
jQuery('.content3').hide();
jQuery('.content4').show();
jQuery('.content5').hide();
jQuery('.content6').hide();
return false;
});
jQuery('.page5').click(function(){
jQuery('.content1').hide();
jQuery('.content2').hide();
jQuery('.content3').hide();
jQuery('.content4').hide();
jQuery('.content5').show();
jQuery('.content6').hide();
return false;
});
jQuery('.page6').click(function(){
jQuery('.content1').hide();
jQuery('.content2').hide();
jQuery('.content3').hide();
jQuery('.content4').hide();
jQuery('.content5').hide();
jQuery('.content6').show();
return false;
});
});
</script>
<span class="content1">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">There
are many girls who do not leave house without doing makeup on their face, even
if it is to go to the nearest shop, while there are also some girls who
consider the makeup like a waste of time.
However, for special occasions, such girls also make use of makeup to
look cuter!</span></div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Here in
this post I have mentioned some handy makeup tips which does not take your much
time.</span><br />
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br /></span></div>
<h3 style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: Georgia, Times New Roman, serif; font-size: large; line-height: 115%;"> Tip:1 Use Correction Fluid Properly</span></h3>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-CDkciSOhSDs/VogDeWeDBBI/AAAAAAAAADA/zb0N9yA5Pic/s1600/Make%2Bup%2Btips.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="makeup tips" border="0" src="http://4.bp.blogspot.com/-CDkciSOhSDs/VogDeWeDBBI/AAAAAAAAADA/zb0N9yA5Pic/s1600/Make%2Bup%2Btips.jpg" title="" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-V2H0VE6kdwU/VogFWa8fXzI/AAAAAAAAADU/qeNNoVoF9Qo/s1600/eye%2Bmake%2Bup.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="correct eye makeup vs incorrect eye makeup" border="0" src="http://4.bp.blogspot.com/-V2H0VE6kdwU/VogFWa8fXzI/AAAAAAAAADU/qeNNoVoF9Qo/s1600/eye%2Bmake%2Bup.jpg" title="" /></a></div>
</div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<br /></div>
</span>
<span class="content2" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;">Tip:2 Comb Your Eyebrows</span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">If you
do not have enough time for a full makeup, comb your eyebrows simply, it can
dramatically change your look.</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="full makeup tips" border="0" src="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" title="" /></a></div>
<br /></div>
</span>
<span class="content3" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;"><span style="line-height: 115%;">Tip:3 </span><span style="line-height: 18.4px;">Use A Credit Card</span></span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use a
credit card or any other hard card to draw a straight line to trace the
"cat's eyes"</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-Md5EUwViUWE/VogGWTTYBCI/AAAAAAAAADk/7Z6q8XtlyK8/s1600/use%2Beyeliner.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="use credit card to draw straight line" border="0" src="http://2.bp.blogspot.com/-Md5EUwViUWE/VogGWTTYBCI/AAAAAAAAADk/7Z6q8XtlyK8/s1600/use%2Beyeliner.jpg" title="" /></a></div>
<br /></div>
</span>
<span class="content4" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-size: large;"><span style="font-family: "Georgia","serif"; line-height: 115%;">Tip:4 </span><span style="font-family: Georgia, serif; line-height: 18.4px;">Use Clear Pencil</span></span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use
clear pencil as a basis for intense color on your eyelids.</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-eQqNha7Ul4s/VogGh0bCddI/AAAAAAAAADs/nHFFmXfQtFo/s1600/base.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="base" border="0" src="http://2.bp.blogspot.com/-eQqNha7Ul4s/VogGh0bCddI/AAAAAAAAADs/nHFFmXfQtFo/s1600/base.jpeg" title="" /></a></div>
<br /></div>
</span>
<span class="content5" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large; line-height: 18.4px;">Tip:5 Paint Your Eyelashes Cleaner</span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use a
credit card or any other hard card to paint your eyelashes cleaner.</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-DuXSluThtqE/VogGqv0KHBI/AAAAAAAAAD0/JSy7bmMQm7Q/s1600/eyelashes%2Bcleaner.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="eyelashes cleaner" border="0" src="http://2.bp.blogspot.com/-DuXSluThtqE/VogGqv0KHBI/AAAAAAAAAD0/JSy7bmMQm7Q/s1600/eyelashes%2Bcleaner.jpg" title="" /></a></div>
<br /></div>
</span>
<span class="content6" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;"><span style="line-height: 115%;">Tip:6 </span><span style="line-height: 18.4px;">Use Light Shade Pencil</span></span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use
light shade pencil to give more freshness and vigor to your eyes.</span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-kb1lAlxKnfA/VogG7Nu43YI/AAAAAAAAAD8/tJmBrrpjFXA/s1600/eye%2Bpencil.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="eye pencil" border="0" src="http://4.bp.blogspot.com/-kb1lAlxKnfA/VogG7Nu43YI/AAAAAAAAAD8/tJmBrrpjFXA/s1600/eye%2Bpencil.jpg" title="" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
If you like this post, don't forget to share these makeup tips with your friends!!!</div>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br /></span></div>
</span>
<p><b>Pages: <span style="color: #3d85c6">
<a href="#" class="page1">1</a>
<a href="#" class="page2">2</a>
<a href="#" class="page3">3</a>
<a href="#" class="page4">4</a>
<a href="#" class="page5">5</a>
<a href="#" class="page6">6</a></span></b></p>
Upvotes: 0
Views: 115
Answers (3)
Mi-Creativity
Reputation: 9654
First shortening the code by adding .contents class to all section divs, and instead of this
jQuery('.content1').show();
jQuery('.content2').hide();
jQuery('.content3').hide();
jQuery('.content4').hide();
jQuery('.content5').hide();
jQuery('.content6').hide();
we just do it like:
jQuery('.contents').hide();
jQuery('.content1').show();
Then move the first two paragraph out of the first .content1, and wrap them in another div with same classes contents and content1 to hide and show it same time as we show and hide the first section with "Tip:1 Use Correction Fluid Properly" title.
Also the page needs to scroll up every time it shows new section instead of staying at the end of the page we add this line jQuery(window).scrollTop(0) (*), so now we have this code:
Full Code:
jQuery(document).ready(function() {
jQuery('.page1').click(function() {
jQuery('.contents').hide();
jQuery('.content1').show();
jQuery(window).scrollTop(0);
return false;
});
jQuery('.page2').click(function() {
jQuery('.contents').hide();
jQuery('.content2').show();
jQuery(window).scrollTop(0);
return false;
});
jQuery('.page3').click(function() {
jQuery('.contents').hide();
jQuery('.content3').show();
jQuery(window).scrollTop(0);
return false;
});
jQuery('.page4').click(function() {
jQuery('.contents').hide();
jQuery('.content4').show();
jQuery(window).scrollTop(0);
return false;
});
jQuery('.page5').click(function() {
jQuery('.contents').hide();
jQuery('.content5').show();
return false;
});
jQuery('.page6').click(function() {
jQuery('.contents').hide();
jQuery('.content6').show();
return false;
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="content1 contents">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">There
are many girls who do not leave house without doing makeup on their face, even
if it is to go to the nearest shop, while there are also some girls who
consider the makeup like a waste of time.
However, for special occasions, such girls also make use of makeup to
look cuter!</span>
</div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<br />
</div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Here in
this post I have mentioned some handy makeup tips which does not take your much
time.</span>
<br />
</div>
</div>
<span class="contents content1">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br /></span>
<h3 style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: Georgia, Times New Roman, serif; font-size: large; line-height: 115%;"> Tip:1 Use Correction Fluid Properly</span></h3>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br /></span>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-CDkciSOhSDs/VogDeWeDBBI/AAAAAAAAADA/zb0N9yA5Pic/s1600/Make%2Bup%2Btips.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="makeup tips" border="0" src="http://4.bp.blogspot.com/-CDkciSOhSDs/VogDeWeDBBI/AAAAAAAAADA/zb0N9yA5Pic/s1600/Make%2Bup%2Btips.jpg" title="" />
</a>
</div>
<div class="separator" style="clear: both; text-align: center;">
<br />
</div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-V2H0VE6kdwU/VogFWa8fXzI/AAAAAAAAADU/qeNNoVoF9Qo/s1600/eye%2Bmake%2Bup.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="correct eye makeup vs incorrect eye makeup" border="0" src="http://4.bp.blogspot.com/-V2H0VE6kdwU/VogFWa8fXzI/AAAAAAAAADU/qeNNoVoF9Qo/s1600/eye%2Bmake%2Bup.jpg" title="" />
</a>
</div>
</div>
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<br />
</div>
</span>
<span class="contents content2" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;">Tip:2 Comb Your Eyebrows</span>
</h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">If you
do not have enough time for a full makeup, comb your eyebrows simply, it can
dramatically change your look.</span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="full makeup tips" border="0" src="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" title="" />
</a>
</div>
<br />
</div>
</span>
<span class="contents content3" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;"><span style="line-height: 115%;">Tip:3 </span><span style="line-height: 18.4px;">Use A Credit Card</span></span>
</h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use a
credit card or any other hard card to draw a straight line to trace the
"cat's eyes"</span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-Md5EUwViUWE/VogGWTTYBCI/AAAAAAAAADk/7Z6q8XtlyK8/s1600/use%2Beyeliner.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="use credit card to draw straight line" border="0" src="http://2.bp.blogspot.com/-Md5EUwViUWE/VogGWTTYBCI/AAAAAAAAADk/7Z6q8XtlyK8/s1600/use%2Beyeliner.jpg" title="" />
</a>
</div>
<br />
</div>
</span>
<span class="contents content4" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-size: large;"><span style="font-family: "Georgia","serif"; line-height: 115%;">Tip:4 </span><span style="font-family: Georgia, serif; line-height: 18.4px;">Use Clear Pencil</span></span>
</h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use
clear pencil as a basis for intense color on your eyelids.</span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-eQqNha7Ul4s/VogGh0bCddI/AAAAAAAAADs/nHFFmXfQtFo/s1600/base.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="base" border="0" src="http://2.bp.blogspot.com/-eQqNha7Ul4s/VogGh0bCddI/AAAAAAAAADs/nHFFmXfQtFo/s1600/base.jpeg" title="" />
</a>
</div>
<br />
</div>
</span>
<span class="contents content5" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large; line-height: 18.4px;">Tip:5 Paint Your Eyelashes Cleaner</span>
</h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use a
credit card or any other hard card to paint your eyelashes cleaner.</span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-DuXSluThtqE/VogGqv0KHBI/AAAAAAAAAD0/JSy7bmMQm7Q/s1600/eyelashes%2Bcleaner.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="eyelashes cleaner" border="0" src="http://2.bp.blogspot.com/-DuXSluThtqE/VogGqv0KHBI/AAAAAAAAAD0/JSy7bmMQm7Q/s1600/eyelashes%2Bcleaner.jpg" title="" />
</a>
</div>
<br />
</div>
</span>
<span class="contents content6" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;"><span style="line-height: 115%;">Tip:6 </span><span style="line-height: 18.4px;">Use Light Shade Pencil</span></span>
</h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use
light shade pencil to give more freshness and vigor to your eyes.</span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-kb1lAlxKnfA/VogG7Nu43YI/AAAAAAAAAD8/tJmBrrpjFXA/s1600/eye%2Bpencil.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img alt="eye pencil" border="0" src="http://4.bp.blogspot.com/-kb1lAlxKnfA/VogG7Nu43YI/AAAAAAAAAD8/tJmBrrpjFXA/s1600/eye%2Bpencil.jpg" title="" />
</a>
</div>
<div class="separator" style="clear: both; text-align: center;">
<br />
</div>
<div class="separator" style="clear: both; text-align: center;">
If you like this post, don't forget to share these makeup tips with your friends!!!</div>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br /></span>
</div>
</span>
<p><b>Pages: <span style="color: #3d85c6">
<a href="#" class="page1">1</a>
<a href="#" class="page2">2</a>
<a href="#" class="page3">3</a>
<a href="#" class="page4">4</a>
<a href="#" class="page5">5</a>
<a href="#" class="page6">6</a></span></b>
</p>(*) you have other numbers other than 0 if you don't want the page to scroll to the very top of the page.
Upvotes: 1
Pradeep Potnuru
Reputation: 768
Can you add some code regarding the question.According to what i understood from above question i think you should hide the paragraph when document is ready.
Try this -
$(document).ready(function(){
// Write your hiding code here.
})
Or you can simply add a class to the paragraph which hides the content when u navigate to new pages like -
.hidden {
display: none;
}
You can refine the code as below- it will work fine since i verified in you blog.PLEASE VERIFY THE COMMENTS WHICH ARE IN CAPITAL LETTERS.
<div class="post-body entry-content" id="post-body-3211737812026835425">
<p class="__web-inspector-hide-shortcut__">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
//YOUR HIDING LOGIC HERE
</p>
//CONTENT1 SHOULD COME OUT OF <P> TAG
<span class="content1" style="display: none;">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;">Tip:2 Comb Your Eyebrows</span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">If you
do not have enough time for a full makeup, comb your eyebrows simply, it can
dramatically change your look.</span><br>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="full makeup tips" border="0" src="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" title=""></a></div>
<br></div>
</span>
<span class="content2" style="display: inline;">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;">Tip:2 Comb Your Eyebrows</span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">If you
do not have enough time for a full makeup, comb your eyebrows simply, it can
dramatically change your look.</span><br>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="full makeup tips" border="0" src="http://4.bp.blogspot.com/-vLbbLkcppZM/VogF0m_NLgI/AAAAAAAAADc/q7AuFPN2MhQ/s1600/full%2Bmake%2Bup%2Btips.jpg" title=""></a></div>
<br></div>
</span>
<span class="content3" style="display: none;">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;"><span style="line-height: 115%;">Tip:3 </span><span style="line-height: 18.4px;">Use A Credit Card</span></span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use a
credit card or any other hard card to draw a straight line to trace the
"cat's eyes"</span><br>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-Md5EUwViUWE/VogGWTTYBCI/AAAAAAAAADk/7Z6q8XtlyK8/s1600/use%2Beyeliner.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="use credit card to draw straight line" border="0" src="http://2.bp.blogspot.com/-Md5EUwViUWE/VogGWTTYBCI/AAAAAAAAADk/7Z6q8XtlyK8/s1600/use%2Beyeliner.jpg" title=""></a></div>
<br></div>
</span>
<span class="content4" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-size: large;"><span style="font-family: "Georgia","serif"; line-height: 115%;">Tip:4 </span><span style="font-family: Georgia, serif; line-height: 18.4px;">Use Clear Pencil</span></span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use
clear pencil as a basis for intense color on your eyelids.</span><br>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-eQqNha7Ul4s/VogGh0bCddI/AAAAAAAAADs/nHFFmXfQtFo/s1600/base.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="base" border="0" src="http://2.bp.blogspot.com/-eQqNha7Ul4s/VogGh0bCddI/AAAAAAAAADs/nHFFmXfQtFo/s1600/base.jpeg" title=""></a></div>
<br></div>
</span>
<span class="content5" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large; line-height: 18.4px;">Tip:5 Paint Your Eyelashes Cleaner</span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use a
credit card or any other hard card to paint your eyelashes cleaner.</span><br>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-DuXSluThtqE/VogGqv0KHBI/AAAAAAAAAD0/JSy7bmMQm7Q/s1600/eyelashes%2Bcleaner.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="eyelashes cleaner" border="0" src="http://2.bp.blogspot.com/-DuXSluThtqE/VogGqv0KHBI/AAAAAAAAAD0/JSy7bmMQm7Q/s1600/eyelashes%2Bcleaner.jpg" title=""></a></div>
<br></div>
</span>
<span class="content6" style="display:none">
<div class="MsoNormal" style="margin-bottom: .0001pt; margin-bottom: 0in;">
<h3>
<span style="font-family: Georgia, Times New Roman, serif; font-size: large;"><span style="line-height: 115%;">Tip:6 </span><span style="line-height: 18.4px;">Use Light Shade Pencil</span></span></h3>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;">Use
light shade pencil to give more freshness and vigor to your eyes.</span><br>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-kb1lAlxKnfA/VogG7Nu43YI/AAAAAAAAAD8/tJmBrrpjFXA/s1600/eye%2Bpencil.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="eye pencil" border="0" src="http://4.bp.blogspot.com/-kb1lAlxKnfA/VogG7Nu43YI/AAAAAAAAAD8/tJmBrrpjFXA/s1600/eye%2Bpencil.jpg" title=""></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br></div>
<div class="separator" style="clear: both; text-align: center;">
If you like this post, don't forget to share these makeup tips with your friends!!!</div>
<span style="font-family: "Georgia","serif"; font-size: 12.0pt; line-height: 115%;"><br></span></div>
</span>
<p><b>Pages: <span style="color: #3d85c6">
<a href="#" class="page1">1</a>
<a href="#" class="page2">2</a>
<a href="#" class="page3">3</a>
<a href="#" class="page4">4</a>
<a href="#" class="page5">5</a>
<a href="#" class="page6">6</a></span></b></p>
<p></p>
<div style="clear: both;"></div>
</div>
Upvotes: 1
Ehryk
Reputation: 1990
If you want the first section to be hidden as well, change this:
<span class="content1">
Add your first page content here
</span>
<span class="content2" style="display:none">
Add your second page content here
</span>
<span class="content3" style="display:none">
Add your third page content here
</span>
<span class="content4" style="display:none">
Add your final page content here
</span>
to this:
<span class="content1" style="display:none">
Add your first page content here
</span>
<span class="content2" style="display:none">
Add your second page content here
</span>
<span class="content3" style="display:none">
Add your third page content here
</span>
<span class="content4" style="display:none">
Add your final page content here
</span>
The navigation buttons should then work as you expect.
Upvotes: 0
Related Questions
- JQuery - $ is not defined
- Is there an "exists" function for jQuery?
- Cannot display HTML string
- Setting "checked" for a checkbox with jQuery
- Get class list for element with jQuery
- How to change the href attribute for a hyperlink using jQuery
- jQuery's jquery-1.10.2.min.map is triggering a 404 (Not Found)
- Which keycode for escape key with jQuery
- How to parse the data which contains Html tags like style, color,font family, fontsize and set in textview in android
- making divs with auto margins in parent div with variable height