2018-06-25

Via 定制进阶

Via 浏览器是一个定制性相当强的 android 浏览器，即使是技术上的「麻瓜」也可以通过「设置」-「定制」选项轻松实现自己满意的效果，但是，好奇如你，自然希望了解一些进阶玩法，将 Via 浏览器从「大家的浏览器」变成「专属于你的浏览器」，这篇教程便是为此而生。

HTML 代码

适当调整「设置」-「定制」-「Logo」-「Html 代码」也可以达到不错的效果。我们可以利用 Html 代码轻松实现一些特殊效果。以下效果直接复制粘贴代码至设置项即可用。

粗体文字 logo：

<span style="font-size: 40px; font-weight: bold; text-transform:uppercase;">cool</span>

一言：

<span style="font-size: 16px; font-weight: bold;"><script type="text/javascript" src="https://api.lwl12.com/hitokoto/main/get?encode=js&charset=utf-8"></script><div id="lwlhitokoto"><script>lwlhitokoto()</script></div></script></span>

天气：

<span style="font-size: 25px; font-weight: bold;" id="weather"><script>function ajax(a){a=a||{};a.method=a.method.toUpperCase()||"POST";a.url=a.url||"";a.async=a.async||!0;a.data=a.data||null;a.success=a.success||function(){};var b=null;b=XMLHttpRequest?new XMLHttpRequest:new ActiveXObject("Microsoft.XMLHTTP");var c=[],d;for(d in a.data)c.push(d+"="+a.data[d]);c=c.join("&");"POST"===a.method.toUpperCase()?(b.open(a.method,a.url,a.async),b.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8"),b.send(c)):"GET"===a.method.toUpperCase()&&(b.open(a.method,
a.url+"?"+c,a.async),b.send(null));b.onreadystatechange=function(){4==b.readyState&&200==b.status&&a.success(JSON.parse(b.responseText))}}ajax({method:"GET",url:"http://api.jirengu.com/getWeather.php",success:function(a){console.log(a);now=document.getElementById("weather").innerHTML=a.results[0].weather_data[0];e=document.getElementById("weather");now&&(e.innerHTML=now.weather+"("+now.temperature+")")}});</script></span>

注，天气代码经过压缩，以下为更易二次修改的未压缩代码：

<span style="font-size: 25px; font-weight: bold;" id="weather"><script>
function ajax(opt) {
    opt = opt || {};
    opt.method = opt.method.toUpperCase() || 'POST';
    opt.url = opt.url || '';
    opt.async = opt.async || true;
    opt.data = opt.data || null;
    opt.success = opt.success || function () {};
    var xmlHttp = null;
    if (XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
    else {
        xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
    }var params = [];
    for (var key in opt.data){
        params.push(key + '=' + opt.data[key]);
    }
    var postData = params.join('&');
    if (opt.method.toUpperCase() === 'POST') {
        xmlHttp.open(opt.method, opt.url, opt.async);
        xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
        xmlHttp.send(postData);
    }
    else if (opt.method.toUpperCase() === 'GET') {
        xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async);
        xmlHttp.send(null);
    } 
    xmlHttp.onreadystatechange = function () {
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
            opt.success(JSON.parse( xmlHttp.responseText));
        }
    };
}
ajax({
    method: 'GET',
    url: 'http://api.jirengu.com/getWeather.php',
    success: function (OriginalFromActivity) {
      console.log(OriginalFromActivity);
      now=document.getElementById('weather').innerHTML=OriginalFromActivity.results[0].weather_data[0];
      e = document.getElementById('weather');
      if (now) {
        e.innerHTML = now.weather + '(' + now.temperature + ')';
      }
    }
})</script></span>

以上就是 Html 代码定制，可以轻松利用 Via 浏览器内嵌的主页框架实现各式各样的效果。

添加 CSS

如果对默认主页的样式不满意，可以直接通过添加自定义 css 的方式实现自己想要的效果：「设置」-「定制」-「设置」-「添加自定义 CSS」。以下效果也同样直接复制粘贴代码至设置项即可用。

取消圆形 logo：

.logo img{border-radius: 0}