Navigation

    Monaca & Onsen UI
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. ganeshspear
    G
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    ganeshspear

    @ganeshspear

    0
    Reputation
    7
    Posts
    919
    Profile views
    0
    Followers
    1
    Following
    Joined Last Online

    ganeshspear Follow

    Posts made by ganeshspear

    • getActiveCarouselItemIndex Error..

      I got this Error in onsen carousel…

      Uncaught TypeError: Cannot read property ‘0’ of null
      Class.extend._getCarouselItemElements @ onsen.js:7202
      Class.extend._getCarouselItemCount @ onsen.js:7327
      Class.extend.getActiveCarouselItemIndex @ onsen.js:6916
      (anonymous function) @ script.js:661

      i’m using this function for auto carousel …if i navigate to other pages i got this error repeatedly…

      setInterval(function() { 
      var index1 = loginslider.getActiveCarouselItemIndex();
       if (index1 >= 4) { loginslider.first(); } 
       else { loginslider.next(); } }, 6000); 
      
      posted in Onsen UI
      G
      ganeshspear
    • RE: Active Menu Color ons-navigator

      Thanks…i will check…

      posted in Onsen UI
      G
      ganeshspear
    • RE: Active Menu Color ons-navigator

      @rafitaangkor i already have ons-tab in top…so i don’t like to use in footer…

      posted in Onsen UI
      G
      ganeshspear
    • RE: Active Menu Color ons-navigator

      @Fran-Diox In footer i have four pages Menu. if user clicks Movies page that menu will be highlighted

       <div class="addemo"><img src="images/addemo.jpg"></div>	
        <div class="simofooterbg">
          <div class="footermenu" style="width:21%;" onclick="myNavigator.replacePage('movies.html', { animation : 'fade' } )" > <i class="flaticon-movie47 footermenuicon" ></i><br>
            <p>Movies</p>
          </div>
          <div class="footermenu" style="width:21%;" onclick="myNavigator.replacePage('tvshows.html', { animation : 'fade' } )" > <i class="flaticon-televisions2 footermenuicon" ></i><br>
            <p>TV Shows</p>
          </div>
          <div class="footermenu" style="width:27%;" onclick="myNavigator.replacePage('liveevents.html', { animation : 'fade' } )" > <i class="flaticon-election footermenuicon" ></i><br>
            <p>Live Events</p>
          </div>
          <div class="footermenu" style="width:28%;" onclick="myNavigator.replacePage('shots.html', { animation : 'fade' } )"> <i class="flaticon-drink155 footermenuicon" ></i><br>
            <p>Shots & Cocktails</p>
          </div>
        </div>
      </ons-bottom-toolbar>
      posted in Onsen UI
      G
      ganeshspear
    • Active Menu Color ons-navigator

      Hi,
      How to add color in active menu item using Ons-navigator…

      posted in Onsen UI
      G
      ganeshspear
    • RE: Sliding Menu with navigator

      @Fran-Diox It’s working thanks…

      posted in Onsen UI
      G
      ganeshspear
    • Sliding Menu with navigator

      I am currently building my first cordova app with onsen ui. Looks promising so far! But I ran into a problem I could not solve and I could not find the answer.
      I hope it is a beginner question and can be solved easily by someone with more experience with onsen.
      I want to have a sliding-menu and still the “usual” navigation on the main screen.
      Two different approaches I tried:

      <ons-navigator var="app.navi">
      <ons-page>
      <ons-sliding-menu menu-page="menu.html" main-page="page1.html" side="left"
      var="menu" type="reveal" max-slide-distance="260px" swipable="true">
      </ons-sliding-menu>
      </ons-page>
      </ons-navigator>
      <ons-template id="menu.html">
      <ons-page modifier="menu-page">
      <ons-list-item class="menu-item" ng-click="menu.setMainPage('page2.html', {closeMenu: true})">
      Continue last story
      </ons-list-item>
      ...
      </ons-page>
      </ons-template>
      <ons-template id="page1.html">
      <ons-page ng-controller="BooksCtrl">
      // Navigation in controller:
      app.navi.pushPage("new_action.html", {
      animation: "lift"
      });
      </ons-page>
      </ons-template>
      

      Result: No error messages. But once I navigate from the first main-page to another page I can’t open the sliding menu. (Same as in the official demo found in github repo called navigator_sliding-menu)

      <ons-sliding-menu menu-page="menu.html" main-page="page1.html" side="left"
      var="menu" type="reveal" max-slide-distance="260px" swipable="true">
      </ons-sliding-menu>
      <ons-template id="menu.html">
      <ons-page modifier="menu-page">
      <ons-list-item class="menu-item" ng-click="menu.setMainPage('page2.html', {closeMenu: true})">
      Continue last story
      </ons-list-item>
      ...
      </ons-page>
      </ons-template>
      <ons-template id="page1.html">
      <ons-navigator animation="slide" var="app.navi">
      <ons-page ng-controller="BooksCtrl">
      // Navigation in controller:
      app.navi.pushPage("new_action.html", {
      animation: "lift"
      });
      </ons-page>
      </ons-navigator>
      </ons-template>
      

      Same as here: http://codepen.io/argelius/pen/ogXGeV
      So the navigation element is moved to the first main-page.
      Result: I can navigate through the app (via pushPage in controller) and I can open the menu from every page. But once I click a link in the menu any pushPage calls result in the error messages:
      angular.min.js:108 TypeError: Cannot read property ‘$new’ of null

      Any ideas?
      Thank you in advance

      posted in Onsen UI
      G
      ganeshspear