Permalink
Browse files

fix: style image within Fancybox 图片尺寸自定义

  • Loading branch information...
MOxFIVE committed Mar 4, 2016
1 parent 504d893 commit f91ac7d0d0120d6f425ce46e4975c420f0e06748
Showing with 18 additions and 8 deletions.
  1. +12 −7 README.md
  2. +6 −1 source/js/main.js
View
@@ -122,18 +122,23 @@ background_image: 5
- "0": remove background image and use white-gray theme | 取消网页背景图,使用淳朴的灰白主题
#### 4. Style image 自定义图片样式:
In order to style posts/pages' image with HTML/CSS within `.md` files, you should disable fancybox function firstly.
#### 4. Highlight Style | 文本/代码高亮样式:
Set inline_code to style highlight text & Chose a highlight theme for code block.
如果要使用 HTML/CSS 自定义文章图片样式,需要先关闭 fancybox 功能
通过 inline_code 切换内置文本高亮样式,通过 code_block 切换内置代码高亮配色主题
Disable fancybox in full site | 在全站关闭 fancybox:
> Set `fancybox: false` in `yelee/_config.yml`
```
highlight_style:
#on: true
inline_code: 1
code_block: 1
```
Set `on: true` to enable this feature | 移除`#`后自定义样式生效
Disable fancybox in certain post/page | 在某篇文章中关闭 fancybox:
highlight theme from https://github.com/chriskempson/tomorrow-theme
> Add `fancybox: false` in [front-matter](https://hexo.io/docs/front-matter.html)
#### 5. Comment 评论:
Disqus, duoshuo and youyan is supported, enable them in theme's "_config.yml".
View
@@ -62,7 +62,12 @@ require([], function (){
for(var i=0,len=imgArr.length;i<len;i++){
var src = imgArr.eq(i).attr("src");
var title = imgArr.eq(i).attr("alt");
imgArr.eq(i).replaceWith("<a href='"+src+"' title='"+title+"' rel='fancy-group' class='fancy-ctn fancybox'><img src='"+src+"' title='"+title+"'></a>");
if(typeof(title) == "undefined"){
var title = imgArr.eq(i).attr("title");
}
var width = imgArr.eq(i).attr("width");
var height = imgArr.eq(i).attr("height");
imgArr.eq(i).replaceWith("<a href='"+src+"' title='"+title+"' rel='fancy-group' class='fancy-ctn fancybox'><img src='"+src+"' width="+width+" height="+height+" title='"+title+"' alt='"+title+"'></a>");
}
$(".article-inner .fancy-ctn").fancybox();
}

1 comment on commit f91ac7d

@MOxFIVE

This comment has been minimized.

Show comment
Hide comment
@MOxFIVE
Owner

MOxFIVE commented on f91ac7d Mar 4, 2016

#3

Please sign in to comment.