javascript - Dropdown is reloading home page on click -


i using drop down additional content. not sure why drop down isn't working properly. when clicked on 'read more' link takes me home page or refreshes home page. made jsfiddle , it's doing same there. info on doing wrong appreciated.

$('.expand-notice').on('click', function(e) {      e.preventdefault();      var parent = $(this.parentnode.parentnode);      parent.toggleclass('open-notice');      if (parent.hasclass('open-notice')) $(this).text('less');      else $(this).text('read more');    });
.notice {    background: #dddddd;    max-width: 40em;    margin: 0 auto 0.5em;    padding: 1em;    text-align: center;    font-family: sans-serif;    letter-spacing: 1px;  }  .notice p {    margin: 0;  }  .notice-type,  .notice-title {    font-family: sans-serif;  }  .notice-type {    text-transform: uppercase;    opacity: 0.8;    font-size: 11px;    letter-spacing: 2px;  }  .notice-title {    font-size: 20px;  }  .notice-content {    display: none;    text-align: left;    margin: 5px;  }  .notice-content p {    letter-spacing: 0;    padding: 5px;  }  .open-notice .notice-content {    display: block;  }    .recent-news {    margin: 0em auto;    max-width: 80em;    padding: 0 3% 2em;    overflow: hidden;    text-align: center;  }  .recent-news h2 {    margin-top: 0.5em;  }    .news-item {    display: inline-block;    margin: 1.5em 0 0 0;    width: 47.75%;    background: #fff;    padding: 2em 0em;    text-align: center;    vertical-align: top;  }  .news-item:nth-child(2n) {    margin-left: 3%;  }  .news-item p {    padding: 0em 1.5em;    margin: 0em;    line-height: 1.6;  }  .news-item p.news-date {    font-size: 0.95em;  }
<div class="page" data-subject-page="1">    <div class="largetext" data-subject-text="">      <div class="recent-news">      <h1>main title</h1>        <div class="notice">        <p class="notice-type">date</a>        <p class="notice-title">sub title</p>          <div class="notice-content">          <p>content here</p>          </div>          <p><a href="/" class="expand-notice">read more</a></p>        </div>      </div>    </div>  </div>

remove href attribute tag , wrap scripts 

$(document).ready()

please see fiddle


Comments

Post a Comment

Popular posts from this blog

android - MPAndroidChart - How to add Annotations or images to the chart -

i working latest mpandroidchart library , looking way add annotations or images clickable. example: once data reaches value event occurs want able display user - there multiple events can occur annotations (not sure if right word) or image added @ point in chart. any pointers welcome. check documentation of yaxis . focus on setspacetop(...) , setaxismaxvalue(...) methods. for background: bar-shadow , disable calling: barchart.setdrawbarshadow(false) or change color: bardataset.setbarshadowcolor(int color)
Read more

javascript - Add class to another page attribute using URL id - Jquery -

i have attached id url. ex: when click link 1 , has #tab-2 id , takes me landing page. in landing page have find element has #tab-2 id have add class .active . i tried no luck. please 1 correct code. thanks js fiddle link html <div class="menu"> <ul> <li><a href="http://jsfiddle.net/gscyoa0j/1/#tab-2">link 1</a></li> <li><a href="http://jsfiddle.net/gscyoa0j/1/#tab-44">link 2</a></li> <li><a href="http://jsfiddle.net/gscyoa0j/1/#tab-74">link 3</a></li> </ul> </div> landing page <div class="tab"> <ul> <li><a id="tab-2" class="active" >link 1 content</a></li> <li><a id="tab-44" >link 2 content</a></li> <li><a id="tab-74" >link 3 content</a></l...
Read more

firefox - Where is 'webgl.osmesalib' parameter? -

i'm trying webgl running on firefox (v37.0.2) via software acceleration mesa. tried following steps have been stated in article: http://www.binarytides.com/enable-webgl-firefox-ubuntu/ however, unable find parameter named ' webgl.osmesalib ' in about:config section? has been removed (or renamed)? if yes, how should instruct firefox use mesa's software acceleration webgl? looks support osmesa removed in favour llvmpipe.
Read more