News:

Create A Forum Installed

Author Topic: Can it be done :)  (Read 2686 times)

0 Members and 1 Guest are viewing this topic.

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar
Can it be done :)
« on: November 06, 2012, 02:31:25 am »
http://www.gofunforum.com/

Can this image be coded in so it appears like this at the top of the forum.. So the image is to the right of where it reads " Go Fun Rewards Discussion Forum"..

This is a screen shot where I just placed the image over that area of the forum .
.
I will have to send someone the actual picture ( if it can be done ), because it is actually longer than it appears here.. Guess this forum shrunk it to fit...

« Last Edit: November 06, 2012, 02:35:32 am by TaoGem »

Share on Facebook Share on Twitter


Offline aIURbliS

  • Hero Member
  • *****
  • Posts: 1215
  • Karma: 45
  • Gender: Male
  • Location: U.S.
    • View Profile

Badges: (View All)
Level 6 Sixth year Anniversary Fifth year Anniversary
Re: Can it be done :)
« Reply #1 on: November 06, 2012, 02:45:21 am »
I don't think this could be done with css so I moved it into the coding board.
All codes I make are tested on the latest version of Google Chrome and upon request of other browsers.

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar

Offline aIURbliS

  • Hero Member
  • *****
  • Posts: 1215
  • Karma: 45
  • Gender: Male
  • Location: U.S.
    • View Profile

Badges: (View All)
Level 6 Sixth year Anniversary Fifth year Anniversary
Re: Can it be done :)
« Reply #3 on: November 06, 2012, 02:54:51 am »
Well you might have to re-position the image to fit in but here's the code:
jQuery required, check this topic for latest version: http://support.createaforum.com/5/jquery-v1-8-update/
Footers:
Code: [Select]
<script>$("#upper_section").css("background-image","url(IMAGE_URL)");</script>
All codes I make are tested on the latest version of Google Chrome and upon request of other browsers.

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar
Re: Can it be done :)
« Reply #4 on: November 06, 2012, 03:49:33 am »
If I got it correct, here is what I placed in the footer..
Also place the JQuery in the header
But..... The image is not showing up....
Code: [Select]
<script>$("#upper_section").css("background-image","<img src="http://i1270.photobucket.com/albums/jj612/snuffbottlesplus/vacation2_zps21bbffe2.jpg" border="0" alt="Photobucket"></a>");</script>

Offline aIURbliS

  • Hero Member
  • *****
  • Posts: 1215
  • Karma: 45
  • Gender: Male
  • Location: U.S.
    • View Profile

Badges: (View All)
Level 6 Sixth year Anniversary Fifth year Anniversary
Re: Can it be done :)
« Reply #5 on: November 06, 2012, 03:53:09 am »
You have to do it like this:
Code: [Select]
<script>$("#upper_section").css("background-image","url(http://i1270.photobucket.com/albums/jj612/snuffbottlesplus/vacation2_zps21bbffe2.jpg)");</script>
All codes I make are tested on the latest version of Google Chrome and upon request of other browsers.

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar
Re: Can it be done :)
« Reply #6 on: November 06, 2012, 03:55:57 am »
You beat me back here..
I just figured that out... But, have a look at the forum ... It doubled up the image side by side..
http://gofunforum.com/
 
 

Offline aIURbliS

  • Hero Member
  • *****
  • Posts: 1215
  • Karma: 45
  • Gender: Male
  • Location: U.S.
    • View Profile

Badges: (View All)
Level 6 Sixth year Anniversary Fifth year Anniversary
Re: Can it be done :)
« Reply #7 on: November 06, 2012, 04:07:44 am »
If you didn't want it to repeat, you could try this:
Code: [Select]
<script>$("#upper_section").css({"background-image":"url(http://i1270.photobucket.com/albums/jj612/snuffbottlesplus/vacation2_zps21bbffe2.jpg)","background-repeat":"no-repeat"});</script>
All codes I make are tested on the latest version of Google Chrome and upon request of other browsers.

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar
Re: Can it be done :)
« Reply #8 on: November 06, 2012, 05:00:56 am »
Ok..

That got rid of the double pics..
 
The only thing is that was sort of wanting it to the right a bit.. Had originally wanted it to the right of the forum title.. But that does not really matter.. Just worried that members profile and recent postings link, etc.., will be obscured by the photo..
 
Any ideas how we can move it further to the right ?


Offline aIURbliS

  • Hero Member
  • *****
  • Posts: 1215
  • Karma: 45
  • Gender: Male
  • Location: U.S.
    • View Profile

Badges: (View All)
Level 6 Sixth year Anniversary Fifth year Anniversary
Re: Can it be done :)
« Reply #9 on: November 06, 2012, 02:28:06 pm »
You'll have to redo the image a little bit but here's the code:
Code: [Select]
<script>$("#upper_section").css({"background-image":"url(http://i1270.photobucket.com/albums/jj612/snuffbottlesplus/vacation2_zps21bbffe2.jpg)","background-repeat":"no-repeat","background-position":"right center"});</script>
All codes I make are tested on the latest version of Google Chrome and upon request of other browsers.

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar
Re: Can it be done :)
« Reply #10 on: November 07, 2012, 08:46:39 pm »
That is much better... It took the image to the far right, but that's ok... Can still easily make out the search box..
Actually, can now create an even longer image, to completely fill up the remaing area and keep it just short enough to not interfere with the profile info..
Your tops !
And a big thank you for taking the time !

Offline terrel8125

  • Jr. Member
  • **
  • Posts: 90
  • Karma: 3
    • View Profile

Badges: (View All)
Level 4 One year Anniversary Karma
Re: Can it be done :)
« Reply #11 on: November 21, 2012, 09:18:39 pm »
can u make the code so u can change the width of the pic within the coding

Offline TaoGem

  • Jr. Member
  • **
  • Posts: 98
  • Karma: 0
    • View Profile

Badges: (View All)
Tenth year Anniversary Nineth year Anniversary Avatar
Re: Can it be done :)
« Reply #12 on: November 21, 2012, 10:04:21 pm »
I can not help with answering your question about width, but did notice something about adjusting the height..
It seems that depending on how the forum has set the avatar sizes ( 120 x 120 etc.. ) makes a difference as to the height of that image.  No idea why, but it does..  :)

Offline terrel8125

  • Jr. Member
  • **
  • Posts: 90
  • Karma: 3
    • View Profile

Badges: (View All)
Level 4 One year Anniversary Karma
Re: Can it be done :)
« Reply #13 on: November 21, 2012, 10:29:57 pm »
yeah idk its irratating me cause on my test forums it fits perfectly look ill show u: http://testerforums.createaforum.com/index.php
but on my regular forums it doesnt and i really dont know why look:
http://sanity718.createaforum.com/index.php
and both of those have exact same width percentage of 100% idk what is going on

Offline aIURbliS

  • Hero Member
  • *****
  • Posts: 1215
  • Karma: 45
  • Gender: Male
  • Location: U.S.
    • View Profile

Badges: (View All)
Level 6 Sixth year Anniversary Fifth year Anniversary
Re: Can it be done :)
« Reply #14 on: November 22, 2012, 04:17:03 am »
can u make the code so u can change the width of the pic within the coding
I highly recommend that you just change the image's width with some sort of image software because it A) it may decrease the amount of kb in an image which will result in quicker downloading times and B) it will display much quicker because your web browser doesn't have to modify the image. There are few cases where changing the image's dimensions through coding and this isn't the case. In addition, the required coding is supported all major web browsers however Internet Explorer 8 and below doesn't support the required coding, which means you're leaving a chunk of visitors in the dark.

I can not help with answering your question about width, but did notice something about adjusting the height..
It seems that depending on how the forum has set the avatar sizes ( 120 x 120 etc.. ) makes a difference as to the height of that image.  No idea why, but it does..  :)
Good observation, the height of your image is affected by your avatar because the image is set as a background image for the specified area. Think of how our posts gets bigger when we add more lines of text to it.

yeah idk its irratating me cause on my test forums it fits perfectly look ill show u: http://testerforums.createaforum.com/index.php
but on my regular forums it doesnt and i really dont know why look:
http://sanity718.createaforum.com/index.php
and both of those have exact same width percentage of 100% idk what is going on
Both of the forums show exactly the same image in the same location. As TaoGem has said, the size of your avatar affects the image. It'd be nice if you post a screenshot so I can see what's going on exactly.
« Last Edit: November 22, 2012, 04:20:44 am by xboi209 »
All codes I make are tested on the latest version of Google Chrome and upon request of other browsers.