php - anchor tag doesn't work through a different page -


i have built site using foundation , php. on index.html using foundation scroll feature scroll different sections of page.

on php page wanted set navigation links links respective section on index.html , thought easy using anchor tags. out links first(#second) links through correctly, rest go straight bottom of index.html page.

i have been searching , can't find why 1 work , not others, there missing? here code

//code

//target section in index.html      <div class="row">         <div class="large-8 column large-centered" id="third" data-magellan-target="third">             <h2 class="heading">location</h2>             <div class="border">                 <div id="map">                     <!--map location-->                 </div>             </div>          </div>     </div>   //navigation on php page                  <div class="top-bar-right">                     <ul class="menu vertical medium-horizontal nav" data-responsive-menu="drilldown medium-dropdown" data-magellan>                         <li><a href="index.html">home</a></li>                         <li><a href="#">sales</a></li>                         <li><a href="#">lettings</a></li>                         <li><a href="index.html#second">gallery</a></li>                         <li><a href="index.html#third">location</a></li>                         <li><a href="index.html#fourth">contact us</a></li>                     </ul>                 </div> 

cory code scroll feauture

/**  * magellan module.  * @module foundation.magellan  */ !function(foundation, $) {   'use strict';    /**    * creates new instance of magellan.    * @class    * @fires magellan#init    * @param {object} element - jquery object add trigger to.    * @param {object} options - overrides default plugin settings.    */   function magellan(element, options) {     this.$element = element;     this.options  = $.extend({}, magellan.defaults, this.$element.data(), options);      this._init();      foundation.registerplugin(this);   }    /**    * default settings plugin    */   magellan.defaults = {     /**      * amount of time, in ms, animated scrolling should take between locations.      * @option      * @example 500      */     animationduration: 500,     /**      * animation style use when scrolling between locations.      * @option      * @example 'ease-in-out'      */     animationeasing: 'linear',     /**      * number of pixels use marker location changes.      * @option      * @example 50      */     threshold: 50,     /**      * class applied active locations link on magellan container.      * @option      * @example 'active'      */     activeclass: 'active',     /**      * allows script manipulate url of current page, , if supported, alter history.      * @option      * @example true      */     deeplinking: false,     /**      * number of pixels offset scroll of page on item click if using sticky nav bar.      * @option      * @example 25      */     baroffset: 0   };    /**    * initializes magellan plugin , calls functions equalizer functioning on load.    * @private    */   magellan.prototype._init = function() {     var id = this.$element[0].id || foundation.getyodigits(6, 'magellan'),         _this = this;     this.$targets = $('[data-magellan-target]');     this.$links = this.$element.find('a');     this.$element.attr({       'data-resize': id,       'data-scroll': id,       'id': id     });     this.$active = $();     this.scrollpos = parseint(window.pageyoffset, 10);      this._events();   };   /**    * calculates array of pixel values demarcation lines between locations on page.    * can invoked if new elements added or size of location changes.    * @function    */   magellan.prototype.calcpoints = function(){     var _this = this,         body = document.body,         html = document.documentelement;      this.points = [];     this.winheight = math.round(math.max(window.innerheight, html.clientheight));     this.docheight = math.round(math.max(body.scrollheight, body.offsetheight, html.clientheight, html.scrollheight, html.offsetheight));      this.$targets.each(function(){       var $tar = $(this),           pt = math.round($tar.offset().top - _this.options.threshold);       $tar.targetpoint = pt;       _this.points.push(pt);     });   };   /**    * initializes events magellan.    * @private    */   magellan.prototype._events = function() {     var _this = this,         $body = $('html, body'),         opts = {           duration: _this.options.animationduration,           easing:   _this.options.animationeasing         };      $(window).one('load', function(){       _this.calcpoints();       _this._updateactive();     });      this.$element.on({       'resizeme.zf.trigger': this.reflow.bind(this),       'scrollme.zf.trigger': this._updateactive.bind(this)     }).on('click.zf.magellan', 'a[href^="#"]', function(e) {         e.preventdefault();         var arrival   = this.getattribute('href'),             scrollpos = $(arrival).offset().top - _this.options.threshold / 2 - _this.options.baroffset;          // requestanimationframe disabled plugin         // foundation.move(_this.options.animationduration, $body, function(){           $body.stop(true).animate({             scrolltop: scrollpos           }, opts);         });       // });   };   /**    * calls necessary functions update magellan upon dom change    * @function    */   magellan.prototype.reflow = function(){     this.calcpoints();     this._updateactive();   };   /**    * updates visibility of active location link, , updates url hash page, if deeplinking enabled.    * @private    * @function    * @fires magellan#update    */   magellan.prototype._updateactive = function(/*evt, elem, scrollpos*/){     var winpos = /*scrollpos ||*/ parseint(window.pageyoffset, 10),         curidx;      if(winpos + this.winheight === this.docheight){ curidx = this.points.length - 1; }     else if(winpos < this.points[0]){ curidx = 0; }     else{       var isdown = this.scrollpos < winpos,           _this = this,           curvisible = this.points.filter(function(p, i){             return isdown ? p <= winpos : p - _this.options.threshold <= winpos;//&& winpos >= _this.points[i -1] - _this.options.threshold;           });       curidx = curvisible.length ? curvisible.length - 1 : 0;     }      this.$active.removeclass(this.options.activeclass);     this.$active = this.$links.eq(curidx).addclass(this.options.activeclass);      if(this.options.deeplinking){       var hash = this.$active[0].getattribute('href');       if(window.history.pushstate){         window.history.pushstate(null, null, hash);       }else{         window.location.hash = hash;       }     }      this.scrollpos = winpos;     /**      * fires when magellan finished updating new active element.      * @event magellan#update      */     this.$element.trigger('update.zf.magellan', [this.$active]);   };   /**    * destroys instance of magellan , resets url of window.    * @function    */   magellan.prototype.destroy = function(){     this.$element.off('.zf.trigger .zf.magellan')         .find('.' + this.options.activeclass).removeclass(this.options.activeclass);      if(this.options.deeplinking){       var hash = this.$active[0].getattribute('href');       window.location.hash.replace(hash, '');     }      foundation.unregisterplugin(this);   };   foundation.plugin(magellan, 'magellan');    // exports amd/browserify   if (typeof module !== 'undefined' && typeof module.exports !== 'undefined')     module.exports = magellan;   if (typeof define === 'function')     define(['foundation'], function() {       return magellan;     });  }(foundation, jquery); 

//edit//

i found issue, jquery plugin had installed conflicted magellan feature, once removed worked correctly.

your page may not long enough achieve desired result; anchor tags not make whatever link absolute top item on page instead respect page boundaries (you don't have enough material below tags before hitting bottom of page). guess if added few hundred empty p-tags

<p></p> 

to bottom of index.html , tried again you'd desired response (this test, not solution). may want consider drawers (hide/show) alternative.


Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -