关于解决asp.net mvc网站页面Banner图片即时更换css里背景图片url相对路径问题的新方案
最近在网站首页上想将Banner壁纸给做到后台上传随时更改的效果。遇到问题便是:将上传的图片路径动态添加到首页css代码中,结果尝试了网上提供的思路,更改相对路径,换为url中“../../Content/”以及“./Content/”之类的,但实际操作并没能实现新上传的图片路径加载到css代码中。首页部分css代码贴出:
/*--banner--*/ .banner { background:url(../images/banner-1.jpg) no-repeat 0px 0px; background-size: cover; -webkit-background-size: cover; -o-background-size: cover; -ms-background-size: cover; -moz-background-size: cover; min-height: 600px; }
首页部分html贴出:
<div class="banner"> <div class="container"> <h2>Humanity ,Love ,Devotion</h2> <h2></h2> <p></p> <a href="#service">快速获取我们提供的服务</a> </div> </div>
之前思路是,将上传的图片路径获取后,保存在mysql数据库中,然后写一个分页,在分页里将路径读出来,这时候将css里background:url(../images/banner-1.jpg) no-repeat 0px 0px;换成了一个字段赋值;
关于实现字段赋值实现是这样的:
@using TheOne.Models @using TheOne.MySqlAccess @{ SystemServiceAccess ssAccess = new SystemServiceAccess(); String BannerPicUrl = ssAccess.GetBannerPic(); }
BannerPicUrl被加在 background:url(../@BannerPicUrl) no-repeat 0px 0px;
折腾许久的相对路径,没能达到效果,于是我想出另一种实现思路,能不能将css保留原样,而只要将css引入的图片在文件系统里进行更换、重命名。庆幸的是,asp.net 拥有强大的文件操作功能!于是我开始重新开始写实现功能代码。
这是核心功能,里面有几点需要说明:
[HttpPost] public ActionResult AddBannerPic(HttpPostedFileBase file) { //上传文章封面图片 try { ) { //文件路径后要加后缀.jpg string DeletePath =System.IO.Path.Combine(Server.MapPath( "~/Content/FrontEnd/images"),"Banner-1.jpg"); try { System.IO.File.Delete(DeletePath);//删除指定文件目录下的图片 } catch (Exception f) { throw f; } //重命名上传的图片名称 string NewBannerPicName = "Banner-1.jpg";//指定新文件名 string Path = System.IO.Path.Combine(Server.MapPath("~/Content/FrontEnd/images"), NewBannerPicName);//更新前端Content文件夹下的目录Banner-1图片 file.SaveAs(Path);//存入新路径 } } catch (Exception e) { throw e; return View("Index"); }
- 写出上传页面,并在控制器中的action对文件进行操作,这里用到的上传方法比较老套,没有采用ajax,用的微软提供的方法——HttpPostedFileBase,这里需要说明的是,上传组件<input/>需要注意几点:<input name="file" id="file" type="file" class="file" /> name和id需要注明为file;
- string DeletePath =System.IO.Path.Combine(Server.MapPath( "~/Content/FrontEnd/images"),"Banner-1.jpg");//这里已经写死了,其中Server.MapPath()这个非常实用,可以获取服务器目录的相对路径,保障了应用程序发布时的方便性。
- 这里要引入using System.IO;
- 当图片以二进制上传进入到action时,我们先将已存在的Banner-1.jpg删除,然后,重命名上传的文件名,并保存在旧目录中。
这样我刷新首页时,就能看到我刚上传的图片,这样的实现,没有使用数据库存储,也没有更改css相对路径,只需要使用到文件操作(System.IO)。
项目演示地址:http://www.libertas.ren/
关于解决asp.net mvc网站页面Banner图片即时更换css里背景图片url相对路径问题的新方案的更多相关文章
- 阿里云 Windows Server 2012 r2 部署asp.net mvc网站 平坑之旅
做了多年的Web开发工作,网站部署也不在话下,可每次部署却并不是十分顺利,将本次在阿里云服务器上部署asp.net mvc网站遇到的问题记录如下. 平台是阿里云ECS,操作系统是 Windows Se ...
- 【转载】Asp.Net MVC网站提交富文本HTML标签内容抛出异常
今天开发一个ASP.NET MVC网站时,有个页面使用到了FCKEditor富文本编辑器,通过Post方式提交内容时候抛出异常,仔细分析后得出应该是服务器阻止了带有HTML标签内容的提交操作,ASP. ...
- 【转载】 Asp.Net MVC网站提交富文本HTML标签内容抛出异常
今天开发一个ASP.NET MVC网站时,有个页面使用到了FCKEditor富文本编辑器,通过Post方式提交内容时候抛出异常,仔细分析后得出应该是服务器阻止了带有HTML标签内容的提交操作,ASP. ...
- 关于linux asp.net MVC网站中 httpHandlers配置无效的处理方法
近期有Jexus用户反映,在Linux ASP.NET MVC网站的Web.config中添加 httpHandlers 配置用于处理自定义类型,但是在运行中并没有产生预期的效果,服务器返回了404( ...
- ASP.NET MVC 网站开发总结(三) ——图片截图上传
本着简洁直接,我们就直奔主题吧,这里需要使用到一个网页在线截图插件imgareaselect(请自行下载). 前台页面: <!DOCTYPE html> <html> < ...
- Asp.net MVC网站的基本结构
Asp.net MVC网站的基本结构:Controller->IBLL(定义业务接口)->BLL->DA(调用Utility)->数据库 ,其中A->B表示A调用B 1. ...
- 总结一下ASP.NET MVC 网站的部署问题
总结一下ASP.NET MVC 网站的部署问题 近日,准备把MVC建了一个新的测试站点部署到IIS上面,结果没想到出现了一系列的问题和错误,准备记录一下. 第一个问题,就是如何将MVC的站点部署到II ...
- 用网站(WebSite而不是WebProject)项目构建ASP.NET MVC网站
从ASP.NET MVC第一个版本开始到现在,创建ASP.NET MVC项目的官方方法只有一个,“文件”->“新建”->“项目”,然后选择ASP.NET MVC X Web应用程序. 这种 ...
- 学习ASP.NET MVC(七)——我的第一个ASP.NET MVC 查询页面
在本篇文章中,我将添加一个新的查询页面(SearchIndex),可以按书籍的种类或名称来进行查询.这个新页面的网址是http://localhost:36878/Book/ SearchIndex. ...
随机推荐
- Linux0.11内核--缓冲区机制大致分析
文件系统的文件太多,而且是照搬的MINIX的文件系统,不想继续分析下去了.缓冲区机制和文件系统密切相关,所以这里就简单分析一下缓冲区机制. buffer.c 程序用于对高速缓冲区(池)进行操作和管理. ...
- 【iOS】Alamofire库在iOS7下设置Head无效的问题
声明 欢迎转载,但请保留文章原始出处:) 博客园:http://www.cnblogs.com 农民伯伯: http://over140.cnblogs.com 正文 同样的代码在iOS8下没有问 ...
- dropzonejs中文翻译手册 DropzoneJS是一个提供文件拖拽上传并且提供图片预览的开源类库.
http://wxb.github.io/dropzonejs.com.zh-CN/dropzonezh-CN/ 由于项目需要,完成一个web的图片拖拽上传,也就顺便学习和了解了一下前端的比较新的技术 ...
- ORACLE的SQL JOIN方式小结
在ORACLE数据库中,表与表之间的SQL JOIN方式有多种(不仅表与表,还可以表与视图.物化视图等联结),官方的解释如下所示 A join is a query that combines row ...
- WPF 提示框、确认框、确认输入框
1.提示框 分为提示.异常.失败.成功几种类型 方法: /// <summary> /// 弹出提示 /// 标题:提示 /// </summary> /// <para ...
- TCP协议
TCP是一个面向连接的协议,在发送数据之前,必须在双方之间建立一条连接. TCP首部 TCP数据封装在IP数据报中 TCP包首部 下面简单说明部分字段的作用: 端口号:通讯双方由IP地址和端口号标识. ...
- openstack命令备忘录
原文http://my.oschina.net/u/138210/blog/142661 查看rabbitmq 队列 rabbitmqctl list_queues 查看keystone的用户 key ...
- Kibana+Logstash+Elasticsearch 日志查询系统
搭建该平台的目的就是为了运维.研发很方便的进行日志的查询.Kibana一个免费的web壳:Logstash集成各种收集日志插件,还是一个比较优秀的正则切割日志工具:Elasticsearch一个开源的 ...
- [转]NET Core中实现一个Token base的身份认证
本文转自:http://www.cnblogs.com/Leo_wl/p/6077203.html 注:本文提到的代码示例下载地址> How to achieve a bearer token ...
- UVA 11859 Division Game[Nim游戏]
题意:给定一个N*M的矩阵,每次可以选择同一行中的若干个数,把它们变成它们的质因子.问说先手的可否获胜. 同一行相当于1堆,数量就是所有数的质因子个数之和 #include <iostream& ...