仅当应用程序在 Android 中为运行时，如何将 "android_asset/www/" 添加到 CSS 中的图像路径？

Question

因此，我正在使用 Ionic 框架和 AngularJS 构建一个混合应用程序。我使用以下代码创建了一个自定义样式的音量滑块：

style.css

input[type=range] {
   -webkit-appearance: none;    
   height: 9px;
   background-image: url("/img/bar.png");
   border: none;
   width: 280px;

}

input[type=range]::-webkit-slider-thumb {
   -webkit-appearance: none;
   border: none;
   height: 30px;
   width: 30px;   
   background-image: url("/img/slider.png");

}

当我在浏览器中测试它时，它工作正常。但是问题是：到运行它在Android我必须在图像路径中添加"android_asset/www/"。对于我在 html 中使用的所有图像，我在 js 文件中创建了一个函数，用于检测应用程序是否在运行ning 中 Android，如果它 [=58] =] true，函数自动添加"android_asset/www/"。但在我的例子中，音量滑块样式的图像添加在 CSS 中，所以我无法调用 js 函数。

那么，我该如何解决呢？如何将 "android_asset/www/" 添加到 CSS 中的图像路径，仅当它在 Android 中是运行ning 时？ CSS中的js函数有没有办法调用？是否可以从 html 更改 CSS 中的图像路径？

这是js函数的代码：

app.js

$scope.convertAndroid = function(src){
        if(device.platform.toLowerCase() === "android") { src = "/android_asset/www" + src; }
        return src;
};

这就是我在 html

中调用函数的方式

index.html

 <img src={{convertAndroid('/img/something.png')}}>

Answer 1

嗯，这里笼统的概念有误。混合应用程序为每个平台创建单独的 WWW 文件夹，即 web、Android、IOS 等。例如，以下是一般层次结构：

root project
----wwww
--------platforms
------------android
----------------assets
--------------------www
------------ios

也就是说，每个平台都把相关的WWW文件夹作为根目录。如果您在 Android 上运行，它将读取 WWW inside assets。您只需为项目中的每个 WWW 文件夹创建相同的内容。

仅当应用程序在 Android 中为运行时，如何将 "android_asset/www/" 添加到 CSS 中的图像路径？

How to add "android_asset/www/" to the image's path in the CSS only if app is running in Android?

html

javascript

css

hybrid-mobile-app

ionic-framework

仅当应用程序在 Android 中为 运行 时，如何将 "android_asset/www/" 添加到 CSS 中的图像路径？

How to add "android_asset/www/" to the image's path in the CSS only if app is running in Android?

html

javascript

css

hybrid-mobile-app

ionic-framework

仅当应用程序在 Android 中为运行时，如何将 "android_asset/www/" 添加到 CSS 中的图像路径？