CSS Tricks

Share12017-02-26 14:29:50

Posted by: C3La-NS
Administrator
Posts: 117
Sex: Male
Respect: +27
Positive: +16
Last visit:
2020-02-23 23:29:56
Registered: 2015-02-04

Changing menu links (by kolobdur74)
to HTML-top or custom style without tags <style></style>

<style>
#navindex a:before {content:"New name";} /* Home */
#navuserlist a:before {content:"New name";} /* Members */
#navrules a:before {content:"New name";} /* Rules */
#navsearch a:before {content:"New name";} /* Search */
#navprofile a:before {content:"New name";} /* Profile */
#navpm a:before {content:"New name";} /* Messages (counter will not be displayed) */
#navadmin a:before {content:"New name";} /* Administration */
#navlogin a:before {content:"New name";} /* Login */
#navlogout a:before {content:"New name";} /* Logout */
#pun-navlinks li a span {font-size:0;}
</style>

+1

Share22017-02-26 19:01:58

Posted by: kami
Advanced Member
Posts: 162
Sex: Female
Respect: +23
Positive: +46
Last visit:
2021-08-05 21:59:34
Registered: 2016-12-23

Thanks for sharing...
before getting translation ...
Do you have CSS Trick for:
Active Topics Replies Unanswered topics My posts My uploads Subscription Mark all as read

0

Share32017-03-01 17:18:43

Posted by: Alex_63
Administrator
Posts: 84
Respect: +21
Positive: +20
Last visit:
2020-04-20 13:02:54
Registered: 2015-08-12

kami
Try to use this script (in HTML footer)

<script>
var Img_Word=0; //0-Image;1-Word /Change to Image or Word ?
ulinks=new Array(
".item1","Word or link of image", // New posts
".item2","Word or link of image", // Active topics
".item7:first","Word or link of image", // Replies
".item3","Word or link of image", // Unanswered topics
".item4","Word or link of image", // My posts
".item5","Word or link of image", // My uploads
".item6","Word or link of image", // Subscription
".item7:last","Word or link of image" // Mark all as read - !Last element without ","
)
var s,i;for (i=0; i < ulinks.length; i++){s=ulinks[i+1];
if(!Img_Word){s='<img class="ulinks" src="'+s+'" border="0" />'}
$("#pun-ulinks "+ulinks[i]+" a").html("<span>"+s+"</span>");i++;}
</script>

+1

Share42017-03-02 07:01:38

Posted by: kami
Advanced Member
Posts: 162
Sex: Female
Respect: +23
Positive: +46
Last visit:
2021-08-05 21:59:34
Registered: 2016-12-23

Alex_63 wrote:

kami
Try to use this script (in HTML footer)

it seems the code does not work perfectly if using the "word" instead of using the link of image

Last edited by kami (2017-03-02 10:01:56)

0

Share52017-03-04 16:56:37

Posted by: Admin
Administrator
Posts: 49
Respect: +21
Positive: +13
Last visit:
2020-12-02 22:47:55
Registered: 2015-01-20

kami wrote:

it seems the code does not work perfectly if using the "word" instead of using the link of image

Did you change the value of a variable?

Alex_63 wrote:

var Img_Word=0; //0-Image;1-Word /Change to Image or Word ?

0

Share62017-03-04 22:30:09

Posted by: kami
Advanced Member
Posts: 162
Sex: Female
Respect: +23
Positive: +46
Last visit:
2021-08-05 21:59:34
Registered: 2016-12-23

Admin wrote:

Did you change the value of a variable?
Alex_63 wrote:

var Img_Word=0; //0-Image;1-Word /Change to Image or Word ?

before this I did not notice it so I did not get the desired implementation

var Img_Word=1; if u want to Change to Word

+1

Share72017-04-11 15:15:51

Posted by: kami
Advanced Member
Posts: 162
Sex: Female
Respect: +23
Positive: +46
Last visit:
2021-08-05 21:59:34
Registered: 2016-12-23

C3La-NS wrote:

Changing menu links (by kolobdur74)
to HTML-top or custom style without tags <style></style>

<style>
#navindex a:before {content:"New name";} /* Home */
#navuserlist a:before {content:"New name";} /* Members */
#navrules a:before {content:"New name";} /* Rules */
#navsearch a:before {content:"New name";} /* Search */
#navprofile a:before {content:"New name";} /* Profile */
#navpm a:before {content:"New name";} /* Messages (counter will not be displayed) */
#navadmin a:before {content:"New name";} /* Administration */
#navlogin a:before {content:"New name";} /* Login */
#navlogout a:before {content:"New name";} /* Logout */
#pun-navlinks li a span {font-size:0;}
</style>

the header is not perfect when viewed using a mobile phone (mobiling)

0

Share82017-04-11 19:43:23

Posted by: C3La-NS
Administrator
Posts: 117
Sex: Male
Respect: +27
Positive: +16
Last visit:
2020-02-23 23:29:56
Registered: 2015-02-04

kami
Try to add the parts that I marked with red.

<style>
@media screen and (min-width: 540px){
#navindex a:before {content:"New name";} /* Home */
#navuserlist a:before {content:"New name";} /* Members */
#navrules a:before {content:"New name";} /* Rules */
#navsearch a:before {content:"New name";} /* Search */
#navprofile a:before {content:"New name";} /* Profile */
#navpm a:before {content:"New name";} /* Messages (counter will not be displayed) */
#navadmin a:before {content:"New name";} /* Administration */
#navlogin a:before {content:"New name";} /* Login */
#navlogout a:before {content:"New name";} /* Logout */
#pun-navlinks li a span {font-size:0;}
}
</style>

0