javascript - how to include general JS in an html view of MEAN JS app -
i trying add classes html elements js events. everythings works fine if try opening page outside(the meanjs app). if keep view of meanjs module wont work. events not triggering @ all. js script inside view code itself. how solve prblm?
even 'profiledesc' of $scope doesnt bind heading of second thumbnail. whats wrong thing on here? plz me..
<head> <link href='http://fonts.googleapis.com/css?family=raleway:400,800,300' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=josefin+sans' rel='stylesheet' type='text/css'> <link rel="stylesheet" type="text/css" href="modules/core/client/css/set1.css" /> </head> <body class="cbp-spmenu-push" ng-controller="homecontroller"> <div class="container"> <!-- top navigation --> <h2 class="heading">team</h2> <div class="grid"> <div class="row"> <div class="col-md-6 col-xs-12"> <figure class="effect-honey"> <img src="modules/core/client/img/1.jpg" alt="img25"/> <figcaption id="showleftpush" ng-click="profile('kartheek')"> <h2>kartheek javvaji<span></span>  <i>web</i> <i>designer</i></h2> <p class="icon-links"> <a href="#"><span style="font-size:20px; float: right;" class="glyphicon glyphicon-envelope"></span></a> </p> </figcaption> </figure> </div> <div class="col-md-6 col-xs-12"> <div class="col-md-6 col-xs-12"> <figure class="effect-honey"> <img src="modules/core/client/img/7.jpg" alt="img26"/> <figcaption id="showrightpush" ng-click="profile('kavya')"> <h2>{{profiledesc}} arja<span></span>  <i>ux</i> <i>designer</i></h2> <p class="icon-links"> <a href="#"><span style="font-size:20px; float: right;" class="glyphicon glyphicon-envelope"></span></a> </p> </figcaption> </figure> </div> </div> <div class="col-md-6 col-xs-12"> <figure class="effect-honey"> <img src="modules\core\client\img\1.jpg" alt="img25"/> <figcaption id="showleftpush2" ng-click="profile('balaji')"> <h2>sai balaji kadiri<span></span>  <i>human</i> <i>resources</i></h2> <p class="icon-links"> <a href="#"><span style="font-size:20px; float: right;" class="glyphicon glyphicon-envelope"></span></a> </p> </figcaption> </figure> </div> <div class="col-md-6 col-xs-12"> <figure class="effect-honey"> <img src="modules/core/client/img/27.jpg" alt="img26"/> <figcaption id="showrightpush2" ng-click="profile('jane')"> <h2>jane doe<span></span>  <i>mobile</i> <i>dev</i></h2> <p class="icon-links"> <a href="mailto:webmaster@example.com"><span style="font-size:20px; float: right;" class="glyphicon glyphicon-envelope"></span></a> </p> </figcaption> </figure> </div> </div> <br> <br> <hr> <br> </div> <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1"> <h3>profile</h3> <h2>division</h2> <p>{{profiledesc}}</p> <hr> <h2>division</h2> <p>{{profiledesc}}</p> <hr> </nav> <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2"> <h3>profile</h3> <h2>division</h2> <p>{{profiledesc}}</p> <hr> <h2>division</h2> <p>{{profiledesc}}</p> <hr> </nav> <script> var showleftpush = document.getelementbyid( 'showleftpush' ), showrightpush = document.getelementbyid( 'showrightpush' ), body = document.body; menuleft = document.getelementbyid( 'cbp-spmenu-s1' ), menuright = document.getelementbyid( 'cbp-spmenu-s2' ); showleftpush.onclick = function() { //classie.toggle( this, 'active' ); this.classlist.toggle('active'); //classie.toggle( body, 'cbp-spmenu-push-toright' ); body.classlist.toggle('cbp-spmenu-push-toright'); //classie.toggle( menuleft, 'cbp-spmenu-open' ); menuleft.classlist.toggle('cbp-spmenu-open'); disableother( 'showleftpush' ); }; showleftpush.onmouseover = function() { this.classlist.toggle('trail'); } showrightpush.onmouseover = function() { this.classlist.toggle('trail'); } showrightpush.onclick = function() { //classie.toggle( this, 'active' ); this.classlist.toggle('active'); //classie.toggle( body, 'cbp-spmenu-push-toleft' ); body.classlist.toggle('cbp-spmenu-push-toleft'); //classie.toggle( menuright, 'cbp-spmenu-open' ); menuright.classlist.toggle('cbp-spmenu-open'); disableother( 'showrightpush' ); }; showleftpush2.onclick = function() { //classie.toggle( this, 'active' ); this.classlist.toggle('active'); //classie.toggle( body, 'cbp-spmenu-push-toright' ); body.classlist.toggle('cbp-spmenu-push-toright'); //classie.toggle( menuleft, 'cbp-spmenu-open' ); menuleft.classlist.toggle('cbp-spmenu-open'); disableother( 'showleftpush2' ); }; showrightpush2.onclick = function() { //classie.toggle( this, 'active' ); this.classlist.toggle('active'); //classie.toggle( body, 'cbp-spmenu-push-toleft' ); body.classlist.toggle('cbp-spmenu-push-toleft'); //classie.toggle( menuright, 'cbp-spmenu-open' ); menuright.classlist.toggle('cbp-spmenu-open'); disableother( 'showrightpush2' ); }; function disableother( button ) { if( button !== 'showleftpush' ) { //classie.toggle( showleftpush, 'disabled' ); showleftpush.classlist.toggle('disabled'); } if( button !== 'showrightpush' ) { //classie.toggle( showrightpush, 'disabled' ); showrightpush.classlist.toggle('disabled'); } if( button !== 'showleftpush2' ) { //classie.toggle( showleftpush, 'disabled' ); showleftpush2.classlist.toggle('disabled'); } if( button !== 'showrightpush2' ) { //classie.toggle( showrightpush, 'disabled' ); showrightpush2.classlist.toggle('disabled'); } } </script> </body> controller:
angular.module('core').controller('homecontroller', ['$scope', 'authentication', function ($scope, authentication) { // provides authentication context. $scope.authentication = authentication; $scope.profiledesc ='this profie of person selected..!'; $scope.profile = function (name) { $scope.profiledesc='this '+name+'\'s profile'; }; } ]);
Comments
Post a Comment