The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Message background

4 posters

Go down

Solved Message background

Post by Kami-sama February 23rd 2016, 3:21 pm

Hello!

I followed this tutorial:
https://help.forumotion.com/t137252-button-to-choose-the-message-background#926885

Yet I have an issue. The background appears only like this:
Spoiler:

I would like it also to be under the avatar on the left side and in the bottom under the buttons (facebook, skype,..... ) How should I edit the script from the tutorial?
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by Kami-sama February 26th 2016, 6:51 pm

Up Wink
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by Kami-sama March 1st 2016, 10:42 am

up Wink
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by Kami-sama March 8th 2016, 5:41 pm

Soo.... it's not possible? Very Happy
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by Take Notes March 8th 2016, 7:23 pm

So would you like the whole topic page background to be an image you choose?
Take Notes
Take Notes
Helper
Helper

Male Posts : 2337
Reputation : 324
Language : English
Location : Forumountain

Back to top Go down

Solved Re: Message background

Post by Kami-sama March 9th 2016, 3:42 pm

No Wink in the tutorial image example you can see that background is under the post text and avatar. When I use the code, the background is only under the post text. (look at the picture in my first post). I would like the background to also be under the avatar on the left side and in the bottom under the buttons (facebook, skype,..... ) How should I edit the script from the tutorial?
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by Ange Tuteur March 9th 2016, 3:49 pm

Hey,

Change the script to the following for phpbb2 :
Code:
$(function() {
  $("div.postbody").each(function() {
    var n = this;
    if($(".post-entry", n).length) {
      n = $(".post-entry", n)[0]
    }else {
      if($(".content", n).length) {
        n = $(".content", n)[0]
      }
    }
    while(n.nodeType != 3 && n.hasChildNodes()) {
      n = n.childNodes[0]
    }
    if(n.nodeType != 3) {
      return;
    }
    if(n.nodeValue.substr(0,8)  != "[postbg=") {
      return;
    }
    var m = n.nodeValue.match(/^\[postbg=([^\]]*)\]/);
    if(!m) return;
    $(this).closest(".post").find('> td').addClass("postbg").css("background-image", "url(" + m[1] + ")");
    $(this).closest(".post").next().find('> td').addClass("postbg").css("background-image", "url(" + m[1] + ")");
    n.nodeValue = n.nodeValue.replace(/^\[postbg=[^\[]*\]\n?/, "");
    if(!n.nodeValue && n.nextSibling && n.nextSibling.nodeType == 1 && n.nextSibling.tagName == "BR") {
      $(n.nextSibling).remove()
    }
  });
  if($("#text_editor_textarea").length && $.sceditor) {
    var bglist = "http://i.imgur.com/20aRJFn.png,http://i.imgur.com/DcTM2Ng.jpg,http://i.imgur.com/tkC3deY.jpg,http://i.imgur.com/pfTcnqF.png,http://i.imgur.com/dAQtdaR.gif,http://i.imgur.com/48CU2Qx.png,http://i.imgur.com/lRuwoVi.png,http://i.imgur.com/EHp45H1.png,http://i.imgur.com/8bhbqFF.png,http://i.imgur.com/tb80sYG.png,http://i.imgur.com/6LPhzcp.png,http://i.imgur.com/DkRuYf1.png,http://i.imgur.com/57F0z86.jpg,http://i.imgur.com/PZyMuXF.png".split(",");
    var bgnum = -1;
    var val = $("#text_editor_textarea").val();
    if(val.substr(0,8)  == "[postbg=") {
      var m = val.match(/^\[postbg=([^\]]*)\]/);
      if(m) {
        var r = $.inArray(m[1], bglist);
        if(r != -1) {
          bgnum = r
        }else {
          bgnum = bglist.length - 1
        }
        $(function() {
          $(".sceditor-container").css("background-position", "0 " + ($(".sceditor-toolbar").height() + 6) + "px");
          $(".sceditor-container").css("background-image", "url(" + m[1] + ")")
        });
        $("#text_editor_textarea").val(val.replace(/^\[postbg=[^\[]*\]/, ""))
      }
    }
    $(function() {
      if(!$("#text_editor_textarea").sceditor("instance")) {
        return
      }
      $('<a class="sceditor-button" unselectable="on" title="Background of message"><div unselectable="on" style="background:url(http://i.imgur.com/Hrf5w1i.gif);opacity:1">Background of message</div></a>').insertAfter(".sceditor-button-fahide").click(function(e) {
        if(e.ctrlKey) {
          $(".sceditor-container").css("background-image", "");
          bgnum = -1
        }else {
          bgnum++;
          if(!bgnum) {
            $(".sceditor-container").css("background-position", "0 " + ($(".sceditor-toolbar").height() + 6) + "px")
          }
          $(".sceditor-container").css("background-image", "url(" + bglist[bgnum % bglist.length] + ")")
        }
      })
    });
    $(function() {
      $('form[name="post"]').submit(function() {
        if(bgnum != -1) {
          $("#text_editor_textarea").val(function(i, val) {
            return"[postbg=" + bglist[bgnum % bglist.length] + "]" + val
          })
        }
      })
    })
  }
});

It should apply the background to each cell in the post.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Message background

Post by Kami-sama March 9th 2016, 5:37 pm

Thank you that works.

As I understand it takes ech table element ( <tr> ) and gives it background? And as I understand avatar section is one cell, post section is 2nd and contact buttons is 3rd section?

Now every section gets a background but you can see the "seams". Is it possible to give background to the element witch is "under" the 1st and 2nd cells (under the avatar and post), so there would not be any visible background pattern connection, as it is now.

This may sound a bit overly complicated, when I say it like that Very Happy
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by Ange Tuteur March 9th 2016, 7:01 pm

You could give it to the rows instead of the cells, but some browsers are iffy about that. Therefore, I'd suggest removing the border-spacing on the tables with this CSS rule :
Code:
.forumline { border-spacing:0; }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Message background

Post by Kami-sama March 10th 2016, 4:19 pm

Ah, okey. Thank you a lot, Ange!

SOLVED
Kami-sama
Kami-sama
Forumember

Female Posts : 407
Reputation : 12
Language : EN, RU, DE, LT
Location : Lithuania

http://hogas.huhohi.com/

Back to top Go down

Solved Re: Message background

Post by SLGray March 10th 2016, 6:58 pm

Topic solved and archived


Message background Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51555
Reputation : 3524
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum