Динамическое фоновое изображение на теле (ASP.NET) - PullRequest
Новая
       17

Динамическое фоновое изображение на теле (ASP.NET)

14 голосов
/ 21 февраля 2011

У меня есть ситуация, когда у меня есть ~ 10-20 различных фоновых изображений в папке.Когда мой сайт загружается, мне нужно выбрать одно из этих изображений на основе некоторых значений из базы данных.

Я подумал об использовании runat = server в теге body, а затем добавилатрибуты динамически на page_load, но везде, где я читал это предложение, люди говорят, что это действительно плохая идея ... Кроме того, я попробовал это, и это не сработало (однако не слишком отладило).

Как можно сделать этот «правильный путь»?: -)

Ответы [ 6 ]

12 голосов
/ 22 февраля 2011

Вы можете либо динамически добавить его через общий элемент управления HTML: 

   using System.Web.UI.HtmlControls;


    protected override void OnInit(EventArgs e)
    {
        // Define an Literal control.
        HtmlGenericControl css = new HtmlGenericControl();
        css.TagName = "style";
        css.Attributes.Add("type", "text/css");

        string imageURL = string.Empty;

        //Logic to determin imageURL goes here

        //Update Tag
        css.InnerHtml = @"body{background-image: url(" + imageURL + ");}";


        // Add the Tag to the Head section of the page.
        Page.Header.Controls.Add(css);

        base.OnInit(e);        }

Другой вариант - иметь публично доступное свойство из выделенного кода

* 1006 Е.Г. * 

public string backgroundImage = "defaultImage.png";

Обновите это в событиях инициализации или загрузки страницы.

И ссылаться на него в файле aspx либо в заголовке: 

<style type="text/css">
    body 
    { 
       background-image:url(<%=backgroundImage%>);
    }
 </style>

или как атрибут тега body 

 <body style="background-image: url(<%= backgroundImage %>)">

Любой из них должен помочь вам.

6 голосов
/ 22 февраля 2011

Один из способов сделать это - использовать свойство, подобное этому (метод также будет работать): 

    protected string BodyBackgroundImageUrl
    {
        get
        {
            // I just chose random pic
            return "http://www.google.com/images/logos/ps_logo2.png";
        }
    }

Вам не нужно устанавливать значение, подобное этому, вы можете заполнить его позже изpage Init event.

Затем в теле вы можете сделать что-то вроде: 

    <body style='background:url(<%= BodyBackgroundImageUrl %>) no-repeat;'>

Без повторений просто для того, чтобы показать, что вы можете писать все, что хотите.

Конечно, вы даже можете иметь больше контроля и разные способы вещей: 

    public string GetBodyStyle()
    {
        // Get the picture somehow dynamically
        string bodyBackgroundImageUrl = GetBodyBackgroundImageUrl();

        // You can use StringBuilder or so, not the main point
        var styles = "";

        styles += string.Format("background:url({0}) no-repeat;", bodyBackgroundImageUrl);

        // ... Add some extra styles if you want ...

        return styles;
    }

И тогда ваш тег Body будет выглядеть так: 

   <body style='<%= GetBodyStyle() %>'>

...

Кроме того, вы всегда можете использовать скрытое поле, которому вы присваиваете значение со страницы, а затем в браузере установить URL-адрес фона для этого скрытого поля с помощью JavaScript.

Пример (с использованием jQuery, но вам не обязательно): 

$(function() {
   // ASP.NET will fill the ID, then # with ID will show to JS as one JS string
   var myHiddenField = $('#<%= myServerSideHiddenField.ClientID %>');
   var bodyBackground = "url(" + myHiddenField.val() + ")";
   document.body.css("background" , bodyBackground);
});
2 голосов
/ 21 февраля 2011

Вот как мы это делаем. 

<body runat="server" id="PageBody">

код позади 

PageBody.Style.Add("background-color", "" + returncolor + "");
1 голос
/ 11 июня 2015

Я пользуюсь главной страницей и намекаю на подсказки и подсказки из нескольких предложений. На данный момент я считаю это лучшим и наиболее полным решением:

Пожалуйста, добавьте это Используя: 

using System.Web.UI.HtmlControls;

Внутри главной страницы: 

<body runat="server" id="masterPageBody">

В любой функции страницы с выделенным кодом (например, "Page_Load"): 

HtmlControl masterPageBody =(HtmlControl)Master.FindControl("masterPageBody");
masterPageBody.Style.Remove("background-image");
masterPageBody.Style.Add("background-image", "/images/blah.jpg");
0 голосов
/ 21 марта 2015

Серьезно - это не должно быть так сложно. Я только что реализовал это для чего-то, что я проектирую ... Я понимаю, что этот поток, вероятно, мертв, но эй - я нашел лучшее решение IMO.

ASPX VB: 

 ClientScript.RegisterStartupScript(Me.[GetType](), "Background",
"document.body.style.backgroundImage = " & Chr(34) &
"url('128-700.jpg')" & Chr(34) & ";", True)

Вот и все ... Я называю это прямо из части кода VB. Я все еще учусь, но я знаю, что после поиска и пробовать разные вещи - это было как можно проще.

Хитрость в том, что этот код использует вызов Java для изменения фона по сравнению с изменением CSS.

0 голосов
/ 02 июля 2013 
        serverPath = Request.PhysicalApplicationPath;
        string chosenMap = dropdownlistMap.SelectedItem.Text;

        Bitmap bm = new Bitmap(serverPath + chosenMap);
        int imageWidth = bm.Width;
        int imageHeight = bm.Height;
        bm.Dispose();

        FileInfo fi = new FileInfo(chosenMap);
        string imageSrc = "~/" + fi.Name;

        imgPanel.BackImageUrl = imageSrc;
        imgPanel.Width = imageWidth + 4;
        imgPanel.Height = imageHeight + 4;
        imgPanel.BorderColor = Color.Yellow;
        imgPanel.BorderStyle = BorderStyle.Groove;
        imgPanel.BorderWidth = 2;
...