Is there any way for photos to appear circle? Like say that I wanted to have something like this:
Is there a way to acheive this and how would I do it?Alright, thank you! :-)
( That code also doesn't work :/ )
Okay, if MZD doesn't reply I will see if I can get some code to work in a sandbox and give you a new set.
My previous code was mostly guessing, so it doesn't surprise me it doesn't work.
I did test the code on another site, but not on Wikia itself so maybe the issue lies there. I'll test it on my wiki in a few here and see what I can do.
Alright, here's a working example using the second hover code
http://popn-music.wikia.com/wiki/User:ΜΖD/Sandbox
This is the CSS. If you want other users to be able see the effect as well you have to put it in your Wikia.css (height and width under .circular can be changed to your liking)
.circular { display: block; position: relative; height: 250px; width: 250px; overflow: hidden; border-radius: 50%; } .circular:hover { transform: rotate(-360deg); -moz-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -o-transform: rotate(-360deg); -webkit-transition: all .9s ease; -moz-transition: all .9s ease; -o-transition: all .9s ease; }
Then the code you'll use on your page is:
<div class="circular">[[Datei:lg2.png]]</div> <div class="circular">[[Datei:lg1.png]]</div> <div class="circular">[[Datei:lg3.png]]</div>
http://de.americanhorrorstory.wikia.com/wiki/User:Gagahs/wikia.css
I don't know what I'm doing wrong, but somehow it still doesn't work.. Could you take a look at it?
Gagahs wrote: http://de.americanhorrorstory.wikia.com/wiki/User:Gagahs/wikia.css
I don't know what I'm doing wrong, but somehow it still doesn't work.. Could you take a look at it?
Your CSS is buggy (missing a { )...
Try this:
.circular { display: block; position: relative; height: 450px; width: 450px; overflow: hidden; border-radius: 50%; } .circular:hover { transform: rotate(-360deg); -moz-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -o-transform: rotate(-360deg); -webkit-transition: all .9s ease; -moz-transition: all .9s ease; -o-transition: all .9s ease; }
Yes, it finally worked!! Thank you all so much, though I have one more question: How can I get all three pics in a row? And I want the pics to be centered, like, right now you can only see the hair, you know? But I want the face to show.
But again, thank you so much for your effort, you all really helped me!
Also, if I log out with my account and go on my profile, the pictures are no longer circular, but I want even unregistered users to see them circular :S
Gagahs wrote: Also, if I log out with my account and go on my profile, the pictures are no longer circular, but I want even unregistered users to see them circular :S
That is because you only have it in your personal CSS at the moment. To apply the style for all users, you need to put it in the site's CSS.
Ahhh, okay.
Thank you, I'll do that right away