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.

Sliding Hovering forum title

4 posters

Go down

Solved Sliding Hovering forum title

Post by Quinn March 27th 2013, 2:25 pm

Hello Smile
So um http://foreveryoungss.forumcommunity.net/ ...
This is also my forum. But as you can see it is hosted by another website. Obviously when you hover the title a star goes across it and the title's color changes. Also the description is in a little rounded box.. I was wondering if I can do that with a forumotion forum too? My forumotion one is a bit easier to play around with, also it's in my language, which the other host can't give me so it's really frustrating. Is it possible that I can do the same thing with Javascript/CSS? Thank you in advance.


Last edited by Quinn on March 28th 2013, 1:38 pm; edited 2 times in total
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 2:36 pm

So that is not a Forumotion Forum?
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 3:03 pm

No, but if you check it out you'll see an effect I just described.. It's sadly in HTML. I was wondering how to do that in CSS so I can use it on my forumotion forum? I'm more active on my forumotion one and this one is probably going to be deleted next week.
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 3:37 pm

Your Forumotion URL?
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 3:38 pm

http://demetriaslovato.forumsl.net/ (currently finishing it)
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 3:52 pm

Can you change O NAS on your forum to a very long title please?
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 4:05 pm

Done.
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 4:11 pm

You can add this to your css.
Code:

a.forumlink:hover {
    background-image: url("http://skin.forumfree.net/2084/wmlgs.png");
    background-repeat: no-repeat;
    background-position: right center;
    color: #ff0000;
    padding-left: 0;
    padding-right: 25px;
    transition: all 1s ease 0s;
}
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 4:13 pm

Thank you Smile But is it possible for it to like go across it (it moves) as you can see on my other forum? Smile
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 4:16 pm

I don't understand, its should go across the whole forum link.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 4:26 pm

It doesn't. It just shows up at the end when I hover the title?
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 4:32 pm

transition: all 1s ease 0s;
You did not add this part of the code.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 7:01 pm

I did.
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 7:04 pm

You have not added it. Please add it.
Code:
    a.forumlink:hover {
        transition: all 1s ease 0s !important;
    }
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 7:14 pm

No, I did. I checked it like 10 times. I swear!
http://shrani.si/f/2X/Rf/yCSuOgr/ajs.png
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 7:21 pm

Add it with the !important
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 7:25 pm

Isn't working either.
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 7:59 pm


-moz-transition:all 1s linear;
Add that instead & check.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 8:10 pm

No.. is it possible that you can change it to go across it when you like hover the table/forum? Maybe it'll be easier?
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sanket March 27th 2013, 8:13 pm

We first need to get the right transition property, then we can modify it if possible for the whole span. But, right now the transition property itself isn't working.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sir Chivas™ March 27th 2013, 8:28 pm

Try adding this, see if it works. (CSS): ACP >> Display >> Colors >> CSS

Code:
a.forumlink:hover {
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
color: rgb(250, 109, 14);
background-image: url(http://shrani.si/f/3z/Yt/4pWNnzj8/starr2.png);
background-position: right center;
background-repeat: no-repeat;
padding-left: 0;
padding-right: 25px;
text-decoration: none !important;
}

@Sanket, you were missing this part of the code:
Code:
-webkit-transition: all 1s;
-o-transition: all 1s;
Sir Chivas™
Sir Chivas™
Helper
Helper

Male Posts : 6983
Reputation : 457
Language : EN, FR, ES
Location : || CSS || HTML || Graphics Designs || Support ||

https://aforums.org

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 27th 2013, 9:03 pm

THANK YOU SO MUCH! Both of you! It's working now Smile How about the description in the box?
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Sir Chivas™ March 28th 2013, 4:56 am

Try inserting this HTML as the description:
Code:
<h4 class="desc">Description goes here!</h4>


Add this inside your CSS:
Code:
.desc {
font: 7.5pt arial;
color: #6D6D6D;
background-color: #F7F7F7;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
border-bottom-left-radius: 26px;
border-bottom-right-radius: 43px;
padding: 3px;
box-shadow: 0 0 2px #E5E4E4;
-moz-box-shadow: 0 0 2px #E5E4E4;
-webkit-box-shadow: 0 0 2px #E5E4E4;
border: 1px solid #E2E2E2;
line-height: 95%;
}
Sir Chivas™
Sir Chivas™
Helper
Helper

Male Posts : 6983
Reputation : 457
Language : EN, FR, ES
Location : || CSS || HTML || Graphics Designs || Support ||

https://aforums.org

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Quinn March 28th 2013, 1:36 pm

Thank you!
Quinn
Quinn
Forumember

Posts : 34
Reputation : 1
Language : Slovene

Back to top Go down

Solved Re: Sliding Hovering forum title

Post by Jophy March 28th 2013, 2:58 pm

Topic Solved & Locked
Jophy
Jophy
ForumGuru

Male Posts : 17924
Reputation : 836
Language : English
Location : Somewhere

Back to top Go down

Back to top

- Similar topics

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