搜索到
10
篇与
|资源代码|
的结果
-
JOE主题-移动样式添加二级分类 {mtitle title="添加二级分类"/}前言joe 主题在移动样式下，目录分类不支持多级，所有分类并排成一列，分类太多了展示教程修改 header.php 相关 j-sidebar-xs 中的部分，替换下面部分<div class="card"> <div class="title">类目归类</div> <ul class="category-nav"> <?php while ($categorys->next()) : ?> <?php $children = $categorys->getAllChildren($categorys->mid); ?> <?php if ($categorys->levels === 0): ?> <?php if (empty($children)): ?> <li class='<?php if ($this->is('category', $categorys->slug)) _e("active"); ?>'> <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"> <path d="M325.31499999 764.323l1e-8-508.83099999c0-28.16 22.598-50.934 50.757-50.93400001 13.09300001 0 24.932 5.024 33.901 13.092l335.755 251.633c22.24 16.859 26.905 48.607 10.044 71.024-2.87099999 3.947-6.281 7.355-10.045 10.045l-339.338 254.51c-22.241 16.676-54.16 12.193-70.844-10.225-6.996-9.15-10.225-19.73-10.225-30.31v0z" p-id="6117"></path> </svg> <a href="<?php $categorys->permalink(); ?>"><?php $categorys->name(); ?></a> </li> <?php else: ?> <li class='<?php if ($this->is('category', $categorys->slug)) _e("active"); ?>'> <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"> <path d="M325.31499999 764.323l1e-8-508.83099999c0-28.16 22.598-50.934 50.757-50.93400001 13.09300001 0 24.932 5.024 33.901 13.092l335.755 251.633c22.24 16.859 26.905 48.607 10.044 71.024-2.87099999 3.947-6.281 7.355-10.045 10.045l-339.338 254.51c-22.241 16.676-54.16 12.193-70.844-10.225-6.996-9.15-10.225-19.73-10.225-30.31v0z" p-id="6117"></path> </svg> <a href="<?php $categorys->permalink(); ?>"><?php $categorys->name(); ?> <span><i class="icon iconfont icon-Chevronrighticon text-right"></i><i class="icon iconfont icon-Chevrondownicon text-down"></i></span> </a> <ul> <?php foreach ($children as $mid):?> <?php $child = $categorys->getCategory($mid); ?> <li <?php if($this->is('category', $child['slug'])): ?> class="active"<?php endif; ?>> <a href="<?php echo $child['permalink'] ?>" title="<?php echo $child['name']; ?>"><?php echo $child['name']; ?></a> </li> <?php endforeach; ?> </ul> </li> <?php endif; ?> <?php endif; ?> <?php endwhile; ?> </ul> </div>添加JS控制$('.j-sidebar-xs .item.category ul li a').unbind().bind('click',function (ev) { let c = $(this); c.parent().siblings(".active").toggleClass("active") if(c.next().is("ul") && c.parent().toggleClass("active") && ev.preventDefault()) return false; })添加CSS.item.category{ ul.category-nav li ul{ display: none; padding-left: 2.5em; opacity: 0; height: 0; overflow: auto; -webkit-transition: all .2s ease-in-out 0s; transition: all .2s ease-in-out 0s; li:last-child{ border-bottom: none; } } ul.category-nav li a { span{ float: right; } .text-down{ display: none; } } ul.category-nav li.active { ul { display: block; opacity: 1; height: auto; } a .text-right{ display: none; } a .text-down{ display: block; } } } .j-sidebar-xs .content .item .card ul li { display: block; <!--将原来的flex改为block--> }注意 ：以上为SCSS样式 {dotted startColor="#ff6c6c" endColor="#1989fa"/}OVRT -
JOE主题-添加移动下边栏 教程首先在 component 文件夹里新建一个 footer.navimobi.php ，其中 JNavigation 可换成自己的链接<?php /** * 手机底部列表菜单 */ if (!Helper::options()->JMobiset) return; //$settings = Helper::options()->JNavmobi; $all = Typecho_Plugin::export(); $loginUrl = $this->options->loginUrl; if (array_key_exists('TePass', $all['activated'])){ if ($this->user->hasLogin()) $loginUrl = $this->options->index.'/admin/extending.php?panel=TePass/theme/ucenter/profile.php'; else $loginUrl = $this->options->index.'/tepass/signin'; } ?> <nav class="navigation-tab"> <!-- --><?php // $navtops_list = array(); // if (strpos($settings,'||')) { // //解析关键词数组 // $kwsets = array_filter(preg_split("/(\r|\n|\r\n)/",$settings)); // foreach ($kwsets as $kwset) { // $navtops_list[] = explode('||',trim($kwset)); // } // } // ?> <div class="navigation-tab-item"><a href="<?php echo $this->options->index ?>" target="_self"><span class="navigation-tab__icon"><i class="iconfont icon-iconfont icon-zhuye"></i></span></a></div> <div class="navigation-tab-item"><a href="<?php echo $loginUrl ?>" target="_blank"><span class="navigation-tab__icon"><i class="iconfont icon-iconfont icon-denglu"></i></span></a></div> <div class="navigation-tab-item <?php if ($this->is('page')) _e('active'); ?>" id="load_mobinav"><a href="<?php echo $this->options->JNavigation ?>" target="_self"><span class="navigation-tab__icon"><i class="iconfont icon-iconfont icon-paihangbang"></i></span></a></div> <div class="navigation-tab-item" id="mob_goTop"><a><span class="navigation-tab__icon"><i class="iconfont icon-iconfont icon-gotop"></i></span></a></div> <div class="navigation-tab-overlay"></div> </nav> ...在 functions.php 里面加上一个开关// 手机底部导航栏样式 $JMobiset = new Typecho_Widget_Helper_Form_Element_Select('JMobiset',array(0=>'不开启',1=>'开启'),0,'<h2>移动设置 Info</h2><hr>移动底部菜单设置','移动端页脚底部菜单'); $JMobiset->setAttribute('class', 'j-setting-content j-setting-index'); $form->addInput($JMobiset);...在 public/config.php 里面（顶部）引入我们刚刚的文件 <?php $this->need('component/footer.navmobi.php'); ?>最后加上控制 js 和 样式 css$(".navigation-tab-item").bind('click',function() { $(".navigation-tab-item").removeClass("active"); $(this).addClass("active"); $(".navigation-tab-overlay").css({ left: 25 * $(this).prevAll().length + "%" }) }) $("#mob_goTop").click(function () { $("#backToTop").click() }) let load_mobi = $('#load_mobinav') if (load_mobi.hasClass('active')){ $(".navigation-tab-overlay").css({ left: 25 * load_mobi.prevAll().length + "%" }) }...以下代码为 scss ，自己手动转c ss@media (max-width: 768px) { .navigation-tab { display: flex !important; } } /* navigation-tab */ .navigation-tab{ height: 60px; width: 100%; line-height: 1; background-color: #fff; box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22); overflow: hidden; border: 10px solid #fff; display: none; flex-shrink: 0; position: fixed; bottom: 0; z-index: 40; .navigation-tab-item{ display: flex; flex-direction: column; align-items: center; justify-content: center; width: 25%; flex-shrink: 0; line-height: 1; cursor: pointer; transition: 0.3s; position: relative; z-index: 2; &.active { width: 25%; } .navigation-tab__icon { display: block; color: #4298e7; transition-duration: 0.3s; line-height: 1; svg{ width: 24px; height: 24px; fill:#4298e7; } i{ font-size: 24px; } } } .navigation-tab-overlay { border-radius: 20px; background-color: #e4f2ff; height: 100%; width: 25%; position: absolute; left: 0; top: 0; transition: 0.3s; } }...OVER
-
卡片式网站 【前言】很多博友都喜欢发自己的网站但接受者往往只看到网址因此获取不了对方的"点击"【展示】【方法】将以下代码放置网站 head.php 中/有模板的放入模板 header.php 中。<meta itemprop="name" content="网站标题"/> <meta itemprop="image" content="网站要显示的图片链接" /> <meta name="description" itemprop="description" content="网站内容" />2.抓取 XML 将以下代码后缀改为自己的网站，并打开访问https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshareget_urlinfo?url=网站链接同时加上http://或https:// 【链接反馈】
-
循环页面、分类、标签 ** <!--循环显示页面--> ` <?php $this->widget('Widget_Contents_Page_List')->to($pages); ?> <?php while($pages->next()): ?> <span class="nav-item<?php if($this->is('page', $pages->slug)): ?> nav-item-current<?php endif; ?>"> <a href="<?php $pages->permalink(); ?>" title="<?php $pages->title(); ?>"> <span><?php $pages->title(); ?></span> </a> </span> <?php endwhile; ?>` <!--结束显示页面--> <!--循环所有分类--> <?php $this->widget('Widget_Metas_Category_List')->to($category); ?> <?php while ($category->next()): ?> <span class="nav-item<?php if($this->is('category', $category->slug)): ?> nav-item-current<?php endif; ?>"> <a href="<?php $category->permalink(); ?>" title="<?php $category->name(); ?>"> <span><?php $category->name(); ?></span> </a> </span> <?php endwhile; ?> <!--结束显示分类--> <!--循环显示标签 其中limit的5为显示数量--> <?php $this->widget('Widget_Metas_Tag_Cloud', array('sort' => 'count', 'ignoreZeroCount' => true, 'desc' => true, 'limit' => 5))->to($tags); ?> <?php while($tags->next()): ?> <span class="nav-item<?php if($this->is('tag', $tags->slug)): ?> nav-item-current<?php endif; ?>"> <a href="<?php $tags->permalink(); ?>" title="<?php $tags->name(); ?>"> <span><?php $tags->name(); ?></span> </a> </span> <?php endwhile; ?> <!--结束显示标签-->**
-
-
By浅汐苏ICP20010588号-1