-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
418 lines (295 loc) · 27.4 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>hpw123</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta property="og:type" content="website">
<meta property="og:title" content="hpw123">
<meta property="og:url" content="https://SuperMan42.github.io/index.html">
<meta property="og:site_name" content="hpw123">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="hpw123">
<link rel="alternative" href="/atom.xml" title="hpw123" type="application/atom+xml">
<link rel="icon" href="/img/favicon.png">
<link rel="stylesheet" href="//cdn.bootcss.com/animate.css/3.5.0/animate.min.css">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/font-awesome/css/font-awesome.min.css">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="/fancybox/jquery.fancybox.css">
<!-- 加载特效 -->
<script src="/js/pace.js"></script>
<link href="/css/pace/pace-theme-flash.css" rel="stylesheet" />
<script>
var yiliaConfig = {
rootUrl: '/',
fancybox: true,
animate: true,
isHome: true,
isPost: false,
isArchive: false,
isTag: false,
isCategory: false,
open_in_new: false
}
</script>
</head>
<body>
<div id="container">
<div class="left-col">
<div class="overlay"></div>
<div class="intrude-less">
<header id="header" class="inner">
<a href="/" class="profilepic">
<img lazy-src="/img/head.jpeg" class="js-avatar">
</a>
<hgroup>
<h1 class="header-author"><a href="/" title="Hi Mate">hpw123</a></h1>
</hgroup>
<div id="switch-btn" class="switch-btn">
<div class="icon">
<div class="icon-ctn">
<div class="icon-wrap icon-house" data-idx="0">
<div class="birdhouse"></div>
<div class="birdhouse_holes"></div>
</div>
<div class="icon-wrap icon-ribbon hide" data-idx="1">
<div class="ribbon"></div>
</div>
<div class="icon-wrap icon-link hide" data-idx="2">
<div class="loopback_l"></div>
<div class="loopback_r"></div>
</div>
<div class="icon-wrap icon-me hide" data-idx="3">
<div class="user"></div>
<div class="shoulder"></div>
</div>
</div>
</div>
<div class="tips-box hide">
<div class="tips-arrow"></div>
<ul class="tips-inner">
<li>菜单</li>
<li>标签</li>
<li>友情链接</li>
<li>关于我</li>
</ul>
</div>
</div>
<div id="switch-area" class="switch-area">
<div class="switch-wrap">
<section class="switch-part switch-part1">
<nav class="header-menu">
<ul>
<li><a href="/Home">博客首页</a></li>
<li><a href="/about">留言打卡</a></li>
<li><a href="/FrontEndGuide">前端导航</a></li>
<li><a href="/tags">静心阅读</a></li>
<li><a href="/instagram">光影之路</a></li>
<li><a href="/tags/随笔">随笔</a></li>
</ul>
</nav>
<nav class="header-nav">
<ul class="social">
<a class="fl mail" target="_blank" href="mailto:[email protected]" title="mail">mail</a>
<a class="fl github" target="_blank" href="https://github.com/SuperMan42" title="github">github</a>
<a class="fl zhihu" target="_blank" href="https://www.zhihu.com/people/hpw-69" title="zhihu">zhihu</a>
<a class="fl weibo" target="_blank" href="http://weibo.com/5583967310/profile?topnav=1&wvr=6&is_all=1" title="weibo">weibo</a>
<a class="fl Instagram" target="_blank" href="https://www.instagram.com/hpw424346976" title="Instagram">Instagram</a>
</ul>
</nav>
</section>
<section class="switch-part switch-part2">
<div class="widget tagcloud" id="js-tagcloud">
</div>
</section>
<section class="switch-part switch-part3">
<div id="js-friends">
<a target="_blank" class="main-nav-link switch-friends-link" href="http://SuperMan42.github.io/">name</a>
</div>
</section>
<section class="switch-part switch-part4">
<div id="js-aboutme">喜欢接触新鲜事物、迎接新的挑战，更爱游离于错综复杂的编码与逻辑中</div>
</section>
</div>
</div>
</header>
</div>
</div>
<div class="mid-col">
<nav id="mobile-nav">
<div class="overlay">
<div class="slider-trigger"></div>
<h1 class="header-author js-mobile-header hide"><a href="/" title="Me">hpw123</a></h1>
</div>
<div class="intrude-less">
<header id="header" class="inner">
<a href="/" class="profilepic">
<img lazy-src="/img/head.jpeg" class="js-avatar">
</a>
<hgroup>
<h1 class="header-author"><a href="/" title="Me">hpw123</a></h1>
</hgroup>
<nav class="header-menu">
<ul>
<li><a href="/Home">博客首页</a></li>
<li><a href="/about">留言打卡</a></li>
<li><a href="/FrontEndGuide">前端导航</a></li>
<li><a href="/tags">静心阅读</a></li>
<li><a href="/instagram">光影之路</a></li>
<li><a href="/tags/随笔">随笔</a></li>
<div class="clearfix"></div>
</ul>
</nav>
<nav class="header-nav">
<div class="social">
<a class="mail" target="_blank" href="mailto:[email protected]" title="mail">mail</a>
<a class="github" target="_blank" href="https://github.com/SuperMan42" title="github">github</a>
<a class="zhihu" target="_blank" href="https://www.zhihu.com/people/hpw-69" title="zhihu">zhihu</a>
<a class="weibo" target="_blank" href="http://weibo.com/5583967310/profile?topnav=1&wvr=6&is_all=1" title="weibo">weibo</a>
<a class="Instagram" target="_blank" href="https://www.instagram.com/hpw424346976" title="Instagram">Instagram</a>
</div>
</nav>
</header>
</div>
</nav>
<div class="body-wrap">
<article id="post-MVP快速开发框架" class="article article-type-post" itemscope itemprop="blogPost">
<div class="article-meta">
<a href="/2016/11/28/MVP快速开发框架/" class="article-date">
<time datetime="2016-11-28T03:00:57.000Z" itemprop="datePublished">2016-11-28</time>
</a>
</div>
<div class="article-inner">
<input type="hidden" class="isFancy" />
<div class="article-entry" itemprop="articleBody">
<h1 id="MVP"><a href="#MVP" class="headerlink" title="MVP"></a>MVP</h1><p>项目<a href="https://github.com/SuperMan42/MVP" target="_blank" rel="external">github</a>地址<a href="https://github.com/SuperMan42/MVP" target="_blank" rel="external">https://github.com/SuperMan42/MVP</a></p>
<p>App based on Material Design + MVP + Rxjava + Retrofit + Okhttp + Glide + Cache + theme + others</p>
<p>本项目本着简洁的思想，让开发更加简单，抽取出了core做为库，可以直接引入进行快捷开发，项目仍在改进中，如果有好的建议或者发现什么问题欢迎<a href="https://github.com/SuperMan42/MVP/issues" target="_blank" rel="external">issue</a>,email<a href="mailto:424346976@qq.com">424346976@qq.com</a>，如果感觉对你有帮助也欢迎点个star，fork，本项目仅做学习交流使用</p>
<p>QQ群：482866708<br><img src="https://github.com/SuperMan42/MVP/blob/master/share.png?raw=true" alt=""></p>
<h2 id="Preview"><a href="#Preview" class="headerlink" title="Preview"></a>Preview</h2><ol>
<li>总览(列表)<br><img src="https://github.com/SuperMan42/MVP/raw/master/1.gif" alt=""> </li>
<li>图片选择器和表情键盘(支持动态表情和emoji表情等)<br><img src="https://github.com/SuperMan42/MVP/raw/master/2.gif" alt=""> </li>
<li>夜间和日间模式切换<br><img src="https://github.com/SuperMan42/MVP/raw/master/3.gif" alt=""> </li>
</ol>
<p><a href="http://pro-app-mt.fir.im/85bcc48436a73ec65be41df573fd81ecbfc7f377.apk?AWSAccessKeyId=e0cada7f00f2465b929656d799937873&Expires=1479991896&Signature=RAHMsJ6bxPgxQxpDStKNj9rC3dE%3D&filename=app-release.apk_1.0.apk" target="_blank" rel="external">Download APK</a><br>(Android 5.0 or above) </p>
<p><img src="https://github.com/SuperMan42/MVP/raw/master/download.png" alt=""></p>
<h2 id="Points"><a href="#Points" class="headerlink" title="Points"></a>Points</h2><ul>
<li>使用Rxjava配合Retrofit2+okhttp做网络请求和缓存</li>
<li>使用RxUtil对线程操作和网络请求结果处理做了封装</li>
<li>使用RxManager对订阅生命周期做了统一管理</li>
<li>使用RxBus做了组件间通信</li>
<li>使用RxPermissions对android6.0进行权限申请</li>
<li>使用Material Design控件和动画</li>
<li>使用MVP架构整个项目，并且抽取出core做为库，导入core即可省去50%的代码开发哦</li>
<li>使用Glide做图片处理和加载</li>
<li>使用Fragmentation简化Fragment的操作和懒加载</li>
<li>日间和夜间模式切换</li>
<li>添加了图片选择器(高仿微信)和表情键盘(支持动态表情)</li>
<li>自己封装了recyclerview和recyclerviewpager实现下拉刷新，上拉加载更多和pagerview功能（只需简单几句代码即可实现各种列表，无需adapter，无需自己设计分页加载）</li>
<li>使用x5WebView做阅览页</li>
<li>日报首页的头部可以循环滚动（使用了rxjava轮循和recyclerviewpager）</li>
</ul>
<h2 id="使用"><a href="#使用" class="headerlink" title="使用"></a>使用</h2><p>1.导入core库 </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div></pre></td><td class="code"><pre><div class="line"></div><div class="line">dependencies {</div><div class="line"> compile 'com.hpw.mvpframe:core:1.0.0'</div><div class="line">}</div><div class="line"></div><div class="line">``` </div><div class="line">2.接口定义(demo) </div><div class="line"></div><div class="line">``` </div><div class="line">abstract class DailyPresenter extends CoreBasePresenter<DailyModel, DailyView> {</div><div class="line"> public abstract void getDailyData();</div><div class="line"></div><div class="line"> public abstract void startInterval();</div><div class="line"> }</div><div class="line"></div><div class="line"> interface DailyModel extends CoreBaseModel {</div><div class="line"> Observable<DailyListBean> getDailyData();</div><div class="line"></div><div class="line"> Observable<ZhihuDetailBean> getZhihuDetails(int anInt);</div><div class="line"> }</div><div class="line"></div><div class="line"> interface DailyView extends CoreBaseView {</div><div class="line"> void showContent(DailyListBean info);</div><div class="line"></div><div class="line"> void doInterval(int i);</div><div class="line"> }</div></pre></td></tr></table></figure>
<p>model(只处理数据)<br>presenter(用来处理vm的业务逻辑)<br>view(界面交互) </p>
<p>3.实现model(demo)</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div></pre></td><td class="code"><pre><div class="line">public class DailyModel implements ZhihuContract.DailyModel {</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public Observable<DailyListBean> getDailyData() {</div><div class="line"> return RxService.createApi(ZhiHuApi.class).getDailyList().compose(RxUtil.rxSchedulerHelper());</div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public Observable<ZhihuDetailBean> getZhihuDetails(int anInt) {</div><div class="line"> return RxService.createApi(ZhiHuApi.class).getDetailInfo(anInt).compose(RxUtil.rxSchedulerHelper());</div><div class="line"> }</div><div class="line">}</div></pre></td></tr></table></figure>
<p>4.实现presenter(demo)</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div></pre></td><td class="code"><pre><div class="line">public class DailyPresenter extends ZhihuContract.DailyPresenter {</div><div class="line"> private int topCount = 0;</div><div class="line"> private int currentTopCount = 0;</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public void onStart() {</div><div class="line"></div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public void getDailyData() {</div><div class="line"> mRxManager.add(mModel</div><div class="line"> .getDailyData()</div><div class="line"> .subscribe(</div><div class="line"> dailyListBean -> {</div><div class="line"> mView.showContent(dailyListBean);</div><div class="line"> topCount = dailyListBean.getTop_stories().size();</div><div class="line"> }, e -> mView.showError("数据加载失败ヽ(≧Д≦)ノ")</div><div class="line"> ));</div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public void startInterval() {</div><div class="line"> mRxManager.add(Observable.interval(5, TimeUnit.SECONDS)</div><div class="line"> .compose(RxUtil.rxSchedulerHelper())</div><div class="line"> .subscribe(aLong -> {</div><div class="line"> if (currentTopCount == topCount)</div><div class="line"> currentTopCount = 0;</div><div class="line"> mView.doInterval(currentTopCount++);</div><div class="line"> }</div><div class="line"> ));</div><div class="line"> }</div><div class="line">}</div></pre></td></tr></table></figure>
<p>三者的创建无先后顺序，按自己的业务逻辑来<br>RxManage用于管理订阅者，观察者以及事件<br>发送事件：<code>mRxManage.post(Constants.msg, user);</code><br>接受事件：<code>mRxManage.on(Constants.msg, arg ->mView.initUserInfo((_User) arg));</code> </p>
<p>5.列表的实现 </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div><div class="line">34</div><div class="line">35</div><div class="line">36</div><div class="line">37</div><div class="line">38</div><div class="line">39</div><div class="line">40</div><div class="line">41</div><div class="line">42</div></pre></td><td class="code"><pre><div class="line">public class WechatFragment extends CoreBaseFragment<WechatPresenter, WechatModel> implements ZhihuContract.WechatView {</div><div class="line"> CoreRecyclerView coreRecyclerView;</div><div class="line"> private static int pageNum = 10;</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public int getLayoutId() {</div><div class="line"> return 0;</div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public View getLayoutView() {</div><div class="line"> coreRecyclerView = new CoreRecyclerView(mContext).init(new BaseQuickAdapter<WXItemBean, BaseViewHolder>(R.layout.item_weichat) {</div><div class="line"> @Override</div><div class="line"> protected void convert(BaseViewHolder helper, WXItemBean item) {</div><div class="line"> Glide.with(mContext).load(item.getPicUrl()).crossFade().into((ImageView) helper.getView(R.id.iv_wechat_item_image));</div><div class="line"> helper.setText(R.id.tv_wechat_item_title, item.getTitle())</div><div class="line"> .setText(R.id.tv_wechat_item_from, item.getDescription())</div><div class="line"> .setText(R.id.tv_wechat_item_time, item.getCtime())</div><div class="line"> .setOnClickListener(R.id.ll_click, v -> {</div><div class="line"> WechatDetailsActivity.start(mContext, item.getTitle(), item.getUrl());</div><div class="line"> });</div><div class="line"> }</div><div class="line"> }).openLoadMore(pageNum, page -> mPresenter.getWechatData(pageNum, page))</div><div class="line"> .openRefresh();</div><div class="line"> return coreRecyclerView;</div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public void initUI(View view, @Nullable Bundle savedInstanceState) {</div><div class="line"></div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public void showContent(List<WXItemBean> mList) {</div><div class="line"> coreRecyclerView.getAdapter().addData(mList);</div><div class="line"> }</div><div class="line"></div><div class="line"> @Override</div><div class="line"> public void showError(String msg) {</div><div class="line"> coreRecyclerView.showLoadMoreFailedView();</div><div class="line"> }</div><div class="line">}</div></pre></td></tr></table></figure>
<p>无需自己创建adapter，无需自己写下拉刷新和上拉加载更多的逻辑（只要添加<code>openLoadMore(pageSize, addDataListener) openRefresh()</code>即可实现刷新和加载）<br>无需写xml布局文件（也可写，demo里两种实现方式）只需要在<code>getLayoutView()</code> 中 return </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div></pre></td><td class="code"><pre><div class="line">new CoreRecyclerView(mContext).init(new BaseQuickAdapter<WXItemBean, BaseViewHolder>(R.layout.item_weichat) {</div><div class="line"> @Override</div><div class="line"> protected void convert(BaseViewHolder helper, WXItemBean item) {</div><div class="line"> //viewholder </div><div class="line"> }</div><div class="line">})</div></pre></td></tr></table></figure>
<p>即可实现列表（使用recyclerviewpager也是如初简单，具体看demo,recyclerviewpager可以实现viewpager所有功能）</p>
<h2 id="TODO"><a href="#TODO" class="headerlink" title="TODO"></a>TODO</h2><ol>
<li>添加aop</li>
<li>继续优化 </li>
<li>还有很多。。。</li>
</ol>
<h2 id="Thanks"><a href="#Thanks" class="headerlink" title="Thanks"></a>Thanks</h2><p><a href="https://github.com/izzyleung/ZhihuDailyPurify/wiki/%E7%9F%A5%E4%B9%8E%E6%97%A5%E6%8A%A5-API-%E5%88%86%E6%9E%90" target="_blank" rel="external">知乎日报API</a> <a href="http://www.tianapi.com/#wxnew" target="_blank" rel="external">微信精选API</a> </p>
</div>
<div class="article-info article-info-index">
<div class="clearfix"></div>
</div>
</div>
</article>
</div>
<footer id="footer">
<div class="outer">
<div id="footer-info">
<div class="footer-left">
© 2016 hpw123
</div>
<div class="footer-right">
<a href="http://hexo.io/" target="_blank">Hexo</a> Theme <a href="https://github.com/luuman/hexo-theme-spfk" target="_blank">spfk</a> by hpw123
</div>
</div>
<div class="visit">
<span id="busuanzi_container_site_pv" style='display:none'>
<span id="site-visit" >本站到访数:
<span id="busuanzi_value_site_uv"></span>
</span>
</span>
<span>, </span>
<span id="busuanzi_container_page_pv" style='display:none'>
<span id="page-visit">本页阅读量:
<span id="busuanzi_value_page_pv"></span>
</span>
</span>
</div>
</div>
</footer>
</div>
<script src="https://7.url.cn/edu/jslib/comb/require-2.1.6,jquery-1.9.1.min.js"></script>
<script src="/js/main.js"></script>
<script>
$(document).ready(function() {
var backgroundnum = 24;
var backgroundimg = "url(/background/bg-x.jpg)".replace(/x/gi, Math.ceil(Math.random() * backgroundnum));
$("#mobile-nav").css({"background-image": backgroundimg,"background-size": "cover","background-position": "center"});
$(".left-col").css({"background-image": backgroundimg,"background-size": "cover","background-position": "center"});
})
</script>
<div class="scroll" id="scroll">
<a href="#"><i class="fa fa-arrow-up"></i></a>
<a href="#comments"><i class="fa fa-comments-o"></i></a>
<a href="#footer"><i class="fa fa-arrow-down"></i></a>
</div>
<script>
$(document).ready(function() {
if ($("#comments").length < 1) {
$("#scroll > a:nth-child(2)").hide();
};
})
</script>
<script async src="https://dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js">
</script>
<script language="javascript">
$(function() {
$("a[title]").each(function() {
var a = $(this);
var title = a.attr('title');
if (title == undefined || title == "") return;
a.data('title', title).removeAttr('title').hover(
function() {
var offset = a.offset();
$("<div id=\"anchortitlecontainer\"></div>").appendTo($("body")).html(title).css({
top: offset.top - a.outerHeight() - 15,
left: offset.left + a.outerWidth()/2 + 1
}).fadeIn(function() {
var pop = $(this);
setTimeout(function() {
pop.remove();
}, pop.text().length * 800);
});
}, function() {
$("#anchortitlecontainer").remove();
});
});
});
</script>
</div>
</body>
</html>