2141 active members
  224 are online

Year

19

Day

260

Time

16:48:06

Guest
Login
snewsgnewsmessagegeneralfactioninventorycombatroom
Message CentreRPG CentreQuestion Centre
Archives » Need help with HTML tags: placing images one atop of another one, rotating images of X degrees
Siarica Aylina

As the title says, I am looking for a method allowing me to use this on the SWC forums.

Also, rotating theses images by 90,180 or 270 degrees is way enough, as it would divide by 4 the amount of work I'd have to provide.

I tried several methods, but all of them failed. If I correctly remember, Kyria Wild had, for some time, a signature with text above a background image, not sure how I could achieve the same, as I would require to place 5 images atop of each other. (yep, 5 layers of images. I could reduce it to 4 layers, but not less.)


____________

--
Hjrool Ohr

Grettings,

It might have been when the CSS was still allowed as wall as extended html tags.
So far with the basic tags you have today, i am afraid your only choice might work on the images itselves for most of your graphic rendering and the overall presentation.


Edited By: Hjrool Ohr on Year 14 Day 75 8:28
____________

sig_hjroolV4.png
http://www.webdesign.org/html-and-css/tutorials/layering-images.8470.html

Rotation isnt supported in HTML, and the few cases where its potentially possible, not universally browser supported.


Hjrool Ohr

She asks for it to be used in SWC forum, which is no more possible according to my knowledge.
But yes it has to do with CSS.


____________

sig_hjroolV4.png
Siarica Aylina

Yes, I want to use it in the SWC forums.

Jevon, I tried to use this method, but here is what happends when you try to post it on SWC:

Before:
{div id="top" style="left: 500px; top: 485px; position: absolute"} {img src="http://www.webdesign.org/img_articles/8470/image1.gif"} {/div}

{div id="under" style="left: 500px; top: 485px; position: absolute"} {img src="http://www.webdesign.org/img_articles/8470/image2.gif"} {/div}

Result:
image1.gif

image2.gif

{img src="http://www.webdesign.org/img_articles/8470/image1.gif" /}

{img src="http://www.webdesign.org/img_articles/8470/image2.gif" /}


Edited By: Siarica Aylina on Year 14 Day 75 9:52
____________

--
Hjrool Ohr

My bad, didn't knew the embedded CSS was allowed again.

You eventually need to set the level of layering for each box.
Z index doc


Edited By: Hjrool Ohr on Year 14 Day 75 9:59
____________

sig_hjroolV4.png
Hjrool Ohr

And maybe if you directly inject those CSS on the {A} box.
As far as i recall there were many trick/workaround to be used to have the final render of a post using CSS due to the processing of the forum code, that needed long hour of edit to make it works.


Edited By: Hjrool Ohr on Year 14 Day 75 10:05
____________

sig_hjroolV4.png
I don't think we allow the DIV tag, do we?


Siarica Aylina

No, we don't allow the Div tag, hence why Jevon's suggestion doesn't works


____________

--
If that didnt work, I have a feeling our forums might not allow for such things anymore.


You know, there is this funky program called photoshop (also GIMP) that magically allows you to put multiple images on top of each other, rotate as much as you like and add text! Then you can save the final image and post that in your signature. Much easier than having to work around code that may or may not work.


____________

Ellias_sig6.png
Siarica Aylina

Ellias,

Using Gimp and/or photoshop is what I use on a near-daily basis. However, in some situations, you cannot simply edit an image, upload it and post in forums. Actually, I am in the process of designing a new game for the gambling hut, who would be a roulette-like game, excepted that it would be made of 3 wheels spinning on top of each other. Each wheel will have a total of 36 possibilities.

36 x 36 x 36 = 46,656 images to design and upload

So no, it will not be possible.

As a reminder, I have programmed this previous raffle Piloted only by an excel sheet. I put an "X" in the correct square of my sheet, and it generates the updated grid, checks for prizes found, and so on:
(I skipped the parts containing no equations in the excel sheet)
gridlogo.png
label.png
1.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
2.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
3.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
4.pngxxxx.pngxx00.png0000.png0000.png00x0.png000x.pngxx.png
5.pngx0x0.png0000.png0000.png0000.png0000.png000x.pngxx.png
6.pngxxxx.pngxxxx.pngxxxx.png0000.png0000.png000x.pngxx.png
7.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
8.png0000.png00xx.pngxxxx.pngxx00.png0000.png000x.png00.png
9.png00x0.png0000.png0000.png0000.png0000.png0000.png00.png
10.pngx0x0.pngx000.png0000.png0x00.png0000.png0000.png00.png
11.png00x0.png0000.png0000.png0000.png0000.png0000.png00.png
12.png00x0.png00x0.png0000.png00x0.png0000.png0000.png00.png
13.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
14.png0000.png0000.png0000.png0000.png0000.png0000.png00.png
15.png0000.png0000.png0000.png0000.png0000.png0x00.png00.png
16.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
17.png0000.png0x00.png0000.png0000.png0000.png0000.png00.png
18.png0000.png0000.png0000.png0000.png0000.png0000.png00.png
19.png0000.png0000.png0000.pngxx00.png0000.png000x.png00.png
20.png0000.png0000.png0000.png0000.png0000.png0000.png00.png
21.png0000.png00x0.png0000.png0000.png0000.png0000.png00.png
22.png0000.png0000.pngx00x.png0000.png0000.pngxx00.png00.png
23.pngx000.png0000.png000x.png0000.png0000.png0000.png00.png
24.png0000.png0000.png0000.png0000.png0000.png0000.png00.png
25.png0000.png0000.png0000.png0000.png0000.png0000.png00.png
26.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxxxx.pngxx.png
bottom.png
Amount of squares bought: 242/676

Current wave: 18

Prizes: (remaining/total amount)

Marauder: 1/2
YT-510: 1/2
Chir'daki: 3/5
Pursuer-Class Enforcement Ship: 1/1
Sprint-class rescue raft: 3/5
JM5000: 1/1
Sysat T-24: 8/12
Docked Sysat T-24: 2/3
R-41 Starchaser: 0/1
Escape Pod: 11/16
R3: 4/4
K4 Security Droid: 60/100
Drax Industries Stock: 0/1
Myorzo Weapon Systems stock: 0/1
Cape: 1/1
DT-12: 1/1
EE-3: 1/1
Engineer vest: 0/1
heavy belt: 1/1
large backpack: 0/1
staff: 0/1
small backpack: 1/1
ELG-3A: 1/1
Keycard: 52/80

Total amount of prizes remaining: 153/243 


With the raffle I have in mind, I would have to create 36 different images (one for each position) per wheel, so 36x3 = 108 images if I can put them atop each other.

If you can spin your images each 90 degrees, it would lower the amount of work needed, with only 108/4 = 27 images to design.

To be honnest, right now, it is more a "I know it must be possible to do so, so I'll do my best to create it" rather than "I'll make a raffle and get rich trololololol".

However, as Jevon pointed out, it seems to be a goal quite impossible to achieve...


Edited By: Siarica Aylina on Year 14 Day 77 0:20
____________

--
Hjrool Ohr

Since CSS doesn't work maybe a php script might do the trick to generate the image you need each turn,
which still means that you need to create the whole batch of 108 images but still allow you to control outside the forum what is displayed on the generated image.

Another option might to eventually generate the rotating of some image via Photoshop scripting.


____________

sig_hjroolV4.png