'web'에 해당되는 글 3건
- 2016.07.08
- 2015.12.13
- 2015.12.12
angularjs 로 현재 메뉴에 avtive 상태 표기하기
대분류 메뉴 아래 dropdown 메뉴의 class='active' 시켜본다.
<li class="dropdown active">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">MEN <i class="fa fa-angle-down"></i></a>
<ul class="dropdown-menu">
<li><a is-active-nav href="productListM.html#MAP1">Tees</a></li>
<li><a is-active-nav href="productListM.html#MAP2">Shirts</a></li>
<li><a is-active-nav href="productListM.html#MAP3">Sweaters & Sweatshirts</a></li>
<li><a is-active-nav href="productListM.html#MAP4">Bottoms</a></li>
<li><a is-active-nav href="productListM.html#MAP5">OuterWear</a></li>
<li><a href="404.html">*sample404</a></li>
</ul>
</li>
스크립트)
app.directive('isActiveNav', ['$location', function ($location) {
return {
restrict: 'A',
link: function (scope, element) {
scope.location = $location;
scope.$watch('location.path()', function (currentPath) {
if (currentPath == element[0].hash.replace("#", "/")) {
element.parent().addClass('active');
} else {
element.parent().removeClass('active');
}
});
}
};
}]);
angular.module 은 한 page에 일단 하나만 하도록.
html tag에
<html lang="en" ng-app="myApp">
출처) http://blog.bastisteiner.com/entry/add-active-to-menu-with-angularjs
'web' 카테고리의 다른 글
| Test : SyntaxHighlighter 3.0.83 (0) | 2015.12.13 |
|---|---|
| highlight.js 테스트 (0) | 2015.12.12 |
class HellowJava
{
public static void main(String[] args)
{
System.out.println("link url ");
System.out.println("http://alexgorbatchev.com/SyntaxHighlighter/manual/configuration/");
System.out.println("참조, http://blueray21.tistory.com/m/post/30");
}
}
class HellowJava
{
public static void main(String[] args)
{
System.out.println("unlink url ");
System.out.println("http://audiodot.com");
System.out.println("http://doitforyou.co.kr");
}
}'web' 카테고리의 다른 글
| angularjs 로 현재 메뉴에 avtive 상태 표기하기 (0) | 2016.07.08 |
|---|---|
| highlight.js 테스트 (0) | 2015.12.12 |
HTML/CSS편집 메뉴에서
highlight.pack.js
tomorrow-night-bright.css
파일 업로드 후
html에
js, css추가
<link rel="stylesheet" href="./images/tomorrow-night-bright.css" />
<!--
업로드한 코어 파일(highlight.pack.js)을 불러옵니다.
이 스크립트는 Highlight.js 라이브러리를 사용하기 위해 필수적입니다.
-->
<script src="./images/highlight.pack.js"></script>
<!--
페이지가 로드될 때 강조를 적용하기 위해 필요한 코드입니다.
-->
<script>hljs.initHighlightingOnLoad();</script>
Highlight적용위해
아래 테그 작성
<pre><code class="html"> 적용할 html tag적어주세요</code></pre>
참고) https://highlightjs.org/usage/
'web' 카테고리의 다른 글
| angularjs 로 현재 메뉴에 avtive 상태 표기하기 (0) | 2016.07.08 |
|---|---|
| Test : SyntaxHighlighter 3.0.83 (0) | 2015.12.13 |
PREV
