The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

change the background through javascript

Go down

change the background through javascript

Post by dejanpetrus on May 16th 2012, 12:00 am




how do I do this in bb3 forum. found that only runs on phpbb so if you want my help, let it be the other way just to be with such a changing picture. healthier and please help.
Sorry for bad English

Here's the CSS and Java script phpbb might benefit

ACP - Display - Pictures and Colors - Colors - CSS Stylesheet:

Code:
    /* Tùy chọn hình nền - www.FMvi.org */
    #custom_background{background-image:url('http://i48.servimg.com/u/f48/16/58/89/73/backgr18.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
    #custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
    #custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
    #bg1{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr20.jpg)!important;background-repeat:repeat-x!important}
    #bg6{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr15.jpg)!important}
    #bg5{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr16.jpg)!important}
    #bg2{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr17.jpg)!important}
    #bg3{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/guitar10.jpg)!important}
    #bg4{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr18.jpg)!important}
    #custom_url{clear:left;padding-top:10px;text-align:center}
    #custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
    #custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
    .bg1{background:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr20.jpg) repeat fixed 50% 0 #000!important}
    .bg2{background:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr12.jpg) no-repeat fixed 50% 0 #000!important}
    .bg3{background:url(http://i48.servimg.com/u/f48/16/58/89/73/guitar10.jpg) repeat fixed 50% 0 #000!important}
    .bg4{background:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr14.jpg) repeat fixed 50% 0 #000!important}
    .bg5{background:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr11.jpg) no-repeat fixed 50% 0 #0E1E2D!important}
    .bg6{background:url(http://i48.servimg.com/u/f48/16/58/89/73/backgr19.jpg) no-repeat fixed 50% 0 #000!important}
    .bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
    #nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
    #nav_background:hover{background-color:#FFF}
    #nav_background:active{background-color:#E71E7B}


ACP - Modules - HTML & JAVASCRIPT - Javascript codes management
Add a Javascript Code
Title * : Tùy chỉnh hình nền
Placement : In all the pages
Javascript Code * :

Code:
  var CopyrightNoticeEn = 'Copyright ©️  by FmVi. All Rights Reserved. Use, modification, and/or distribution of this script is not allowed without direct permission from baivong (gialangsangai2000@yahoo.com). This entire copyright notice must remain in the original, copied, or modified script';
    var CopyrightNoticeVi = 'Bản quyền ©️ FmVi. Giữ toàn quyền. Việc sử dụng, sửa đổi , và / hoặc phân phối mã này mà không được phép trực tiếp từ baivong (gialangsangai2000@yahoo.com) là không được phép. Toàn bộ thông báo bản quyền này phải được giữ nguyên khi sao chép, hoặc sửa đổi';
    $(function () {
      $("#pun-intro").prepend('<img src="http://i48.servimg.com/u/f48/16/58/89/73/nav_ba10.png" alt="Change background image" title="Change background image" id="nav_background" />');
      $("#content").prepend('<div id="toggle_background" style="display: none;"><div id="custom_background"><span id="bg1"></span><span id="bg6"></span><span id="bg5"></span><span id="bg2"></span><span id="bg3"></span><span id="bg4"></span><div id="custom_url"><input type="text" placeholder=" Chọn hình nền khác bằng cách nhập một URL hình ảnh và nhấn [Thay đổi]" id="custom_input"><strong id="custom_submit">Thay đổi</strong></div></div></div>');
      $("#custom_background span").click(function () {
          $("body, .main-head, .main-foot, #pun-intro").removeClass("bg1 bg2 bg3 bg4 bg5 bg6 bg_custom").addClass($(this).attr("id"));
          my_setcookie("custom_background", $(this).attr("id"), true);
      });
      $("#custom_submit").click(function () {
          var urlbg = $("#custom_input").val();
          $("body, .main-head, .main-foot, #pun-intro").removeClass("bg1 bg2 bg3 bg4 bg5 bg6 bg_custom").addClass("bg_custom").css("background-image", "url('" + urlbg + "')");
          my_setcookie("custom_background", urlbg, true);
      });
      $("#nav_background").click(function () {
          $("#toggle_background").slideToggle()
      });
      if (my_getcookie("custom_background") != "") {
          if (my_getcookie("custom_background").length > 4) {
            $("body, .main-head, .main-foot, #pun-intro").addClass("bg_custom").css("background-image", "url(" + my_getcookie("custom_background") + ")");
          } else {
            $("body, .main-head, .main-foot, #pun-intro").addClass(my_getcookie("custom_background"))
          }
      }
    });
avatar
dejanpetrus
New Member

Posts : 23
Reputation : 1
Language : macedonien

http://www.mkd-satelite.forummk.com

Back to top Go down

Re: change the background through javascript

Post by dejanpetrus on May 17th 2012, 1:21 am

bump
avatar
dejanpetrus
New Member

Posts : 23
Reputation : 1
Language : macedonien

http://www.mkd-satelite.forummk.com

Back to top Go down

Re: change the background through javascript

Post by kirk on May 17th 2012, 1:23 am

i dont understand the screen shot,
they are images but not background images? can you try to explain what the whole java is supposed to be doing as well Smile
Thanx
avatar
kirk
Forumaster

Male Posts : 11037
Reputation : 652
Language : English,Vulcan,Klingon, Romulan,& Gorn

Back to top Go down

Re: change the background through javascript

Post by dejanpetrus on May 17th 2012, 1:53 am

than once and changing background and color categories in the title
can also put your picture and can also be changed. but i dont know how to be for phpbb3. Here this is how it works http://dejan.forumcanadien.org/forum phpbb please help
avatar
dejanpetrus
New Member

Posts : 23
Reputation : 1
Language : macedonien

http://www.mkd-satelite.forummk.com

Back to top Go down

Re: change the background through javascript

Post by SLGray on May 17th 2012, 4:16 am

This is a drop-down skin changer that you could use: http://help.forumotion.com/t71484-add-multi-themes-to-your-forum


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

avatar
SLGray
Administrator
Administrator

Male Posts : 41915
Reputation : 2881
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

Re: change the background through javascript

Post by !_NICK_! on May 17th 2012, 5:16 am

www.fmvi.vn That is where the screen shot is from I bet. Razz (Not advertising either.) They won't give the code either. Will have to have someone to code this and make this a tutorial. The only bad thing to get it to work is that almost everything must be transparent. :/
avatar
!_NICK_!
Active Poster

Male Posts : 1505
Reputation : 69
Language : English, HTML, and CSS
Location : In the middle of no return.

Back to top Go down

Back to top


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