Forum Settings
Forums
New
Feb 26, 2013 8:49 PM
#1

Offline
Feb 2010
11294
This cover style uses #more CSS.

This topic is part of our CSS Tutorials and Add-ons section:
http://myanimelist.net/forum/?topicid=419405


Here's another easy way to visually display the DVD/manga covers off your list. It uses a #more CSS style import to show covers.

Note: These setups will make your More button unusable, but most ppl don't use this anyways. Plus I'll provide you a code that removes it from view!

When I hover my cursor over a row, I can see that titles DVD cover preview!


It can be moved to any part of the screen or have tags added, as on this layout!




Step 1: Add one of these imports to the top of your CSS
If you're adding this to an anime list, add this to the top:


If you're adding this to a manga list, add this to the top:

Note: Don't add both imports to one layout code! You need to use the anime import only on an anime list and manga import only on the manga one. You will need two separate layouts for your anime and manga list, see making a separate layout for your manga list here: http://myanimelist.net/forum/?topicid=200320

Alternative imports: If these imports don't work on your list or you simply don't want to use them, see the second post and find "Alternative cover imports".


Step 2: Add the CSS in this link to the bottom of your CSS.
Copy and paste the codes to the bottom of your CSS edit box (don't import these codes). You need it if you're going to use hover tags.
tny.cz/464a7a3d


This code will remove the more link from your list which becomes unusable after you apply the cover style from this topic. The edit and add links will stay the same tho! You don't have to add this line if you want to keep your More button visible, but it will still be unusable. Also the hover tags may become unuseable without these codes.





Step 3: Pick one of these cover setups for your list and add its spoiler code to the bottom of your CSS edit box, then save.
Its that simple! Using the visual displays, pick the setup you want for your list. Take the code from the spoiler underneath it and copy and paste it to your CSS edit box, then save. There's notes in the code on how to customize it and I've added extra info and FAQs at the bottom of the post. You'll be able to move the pic anywhere you please, change the colors of the panels and the size of the cover pics, add shadows and more!


Cover pic by itself

Default setup. The cover will appear on the page when you hover over a row, and can be made larger easily and moved around.

The code:






Cover pic with surrounding area

Both the area around the pic and the pic itself can be resized and adjusted, and also moved anywhere on screen of course!

The code:






Cover pic + tags in separate window

Both the pic and the tags window can be resized and adjusted, and also moved anywhere on screen of course!

Notes: This setup is intended for a list that has Numbers, Score, Type, Episode and Tags all checked on this settings page. If your settings are different and the tags aren't hovering correctly, see my info on it at the bottom of the post. Also in Google Chrome you will probably need to make some adjustments, go to GOOGLE CHROME FIX and adjust the code there as told.

The code:






Cover pic with area around it + tags in separate window

Both the area around the pic and the pic itself can be resized and adjusted, and also moved anywhere on screen of course, same with the tags section.

Notes: This setup is intended for a list that has Numbers, Score, Type, Episode and Tags all checked on this settings page. If your settings are different and the tags aren't hovering correctly, see my info on it at the bottom of the post.
Also in Google Chrome you will probably need to make some adjustments, go to GOOGLE CHROME FIX and adjust the code there as told.

The code:






Cover pic with area and tags in area

If you want the tags under your cover pic and adjustable area around the cover pic. When you move the cover pic, you'll have to move the tags too so they stay under the cover.

Note: This setup is intended for a list that has Numbers, Score, Type, Episode and Tags all checked on this settings page. If your settings are different and the tags aren't hovering correctly, see my info on it at the bottom of the post. Also in Google Chrome you will probably need to make some adjustments, go to GOOGLE CHROME FIX and adjust the code there as told.

The code:



After you install the codes and save, you're done! Remember in Chrome you'll have to adjust the width under GOOGLE CHROME FIX until your columns are straightened. Customize away! In the second post I've put answers to FAQs and extra info you might want or need. To fix tags if they disappear, go straight to What to do if your tags (mini-reviews) aren't showing up at all.
Shishio-kunNov 5, 2018 8:30 PM
Reply Disabled for Non-Club Members
Pages (5) [1] 2 3 » ... Last »
Mar 8, 2013 7:56 PM
#2

Offline
Feb 2010
11294
FAQs and extra effects



Moving the cover pic, areas, and tags around your page



What to do if all your DVD or manga covers aren't showing up




What to do if some of your DVD or manga covers aren't showing up



What to do if you see DVD covers on your manga list



What to do if your tags (mini-reviews) aren't showing up at all



Realign list columns in Google Chrome (when using hover tags)





Remove the preview text (you can change it too!)









Adjusting the background color codes for covers and tags (easy generator)!






Other customizations: picture size, text position etc





Adding animated transition to covers/tags




Add a shadow to the panels





Making your rows highlight on hover too





Turning the preview text into its own panel





Making other parts of your list appear on row hover (for advanced users)



Moving the anime title into the preview pane (for advanced users)



Questions or problems?
You can ask in this topic, be sure to post the code or leave the problem on your layout for a bit so it can be properly examined.
Shishio-kunNov 17, 2018 6:51 PM
Mar 13, 2013 12:18 PM
#3

Offline
May 2012
1921
Nice tut, btw how can i make the animetitle pop up instead of the "Preview" text?
Dont seem to get it with firebug :/
Mar 13, 2013 3:30 PM
#4

Offline
Feb 2010
11294
SylakentH_ said:
Nice tut, btw how can i make the animetitle pop up instead of the "Preview" text?
Dont seem to get it with firebug :/


Quick fix. You simply move that section over there with
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(2)

or just the anime title
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(2) .animetitle

Move either selector to the cover pic with position fixed and left/right codes.

but it will have to be imported which you know how to do. I'm already planning to add that as an easy feature that won't have to be imported and I found a way to take the text from a section and move that while keeping the original text intact, so the codes used here will be outdated later when I can budget the time for this subject more which has been extremely difficult to make easy. Also I want to alter the DVD display code being used to more button works.
Mar 24, 2013 11:08 AM
#5

Offline
Jun 2012
17
Shishio, can u please explain this effect too.
http://i.imgur.com/T4aRUyB.jpg
Mar 24, 2013 11:57 PM
#6

Offline
Feb 2010
11294
CrAziiJaN21 said:
Shishio, can u please explain this effect too.
http://i.imgur.com/T4aRUyB.jpg


? what effect in particular I don't see anything new
Mar 25, 2013 5:02 AM
#7

Offline
Jun 2012
17
Shishio-kun said:
CrAziiJaN21 said:
Shishio, can u please explain this effect too.
http://i.imgur.com/T4aRUyB.jpg


? what effect in particular I don't see anything new


I mean the little picture befor the Animetitle (and in the row) and the pop out effect of this little pics.
If i am the one whos not understand this effect u will maby help me a bit. :)
Mar 25, 2013 5:40 AM
#8

Offline
Feb 2010
11294
CrAziiJaN21 said:
Shishio-kun said:
CrAziiJaN21 said:
Shishio, can u please explain this effect too.
http://i.imgur.com/T4aRUyB.jpg


? what effect in particular I don't see anything new


I mean the little picture befor the Animetitle (and in the row) and the pop out effect of this little pics.
If i am the one whos not understand this effect u will maby help me a bit. :)


Oh that was featured on the Fate/Stay premade layout long ago, I think its a little different the ones in this topic. Are you able to rip it from that layout?
Mar 25, 2013 6:58 AM
#9

Offline
Jun 2012
17
Oh well i found it,thank you.
CrAziiJaN21Mar 26, 2013 10:29 AM
Apr 1, 2013 2:37 PM

Offline
May 2010
1876
It appears to me the cover pics aren't very accurate. Is there a way to help with that?
Apr 1, 2013 5:02 PM

Offline
Apr 2009
159
Air-Dragon said:
It appears to me the cover pics aren't very accurate. Is there a way to help with that?

Can you give me an example of inaccurate cover pic?
Apr 1, 2013 8:30 PM

Offline
Feb 2010
11294
Air-Dragon said:
It appears to me the cover pics aren't very accurate. Is there a way to help with that?


Is it cuz some of them are Naruto? Thats an April Fool's Prank by the site, where the top 100 cover pics or something were changed to Naruto by the site, should be fixed back soon if not now..
Apr 3, 2013 3:20 PM

Offline
Dec 2012
147
OK, so I want to know if it's possible to hover over a row and "More" function opens itself ???

I did try to do a special Preview, and I reached a point where everything looks similar to how I want it at the end:


There is just one thing I want to correct, why while you hover over a row, a preview pops up as it should, but not the content that's inside "More" function (more precisely I want Comments) !!!

BTW, is there a way to disable a class in HTML, using only CSS:

<div id="moreXXX" class="hide" style="display: block;">


And could it be done so that content from "More"(arrow "1") function would open itself where ever I want(like where arrow "3" is), while I hover over a row, but "Tags"(arrow "2") would be shown as well as "Comments"(arrow "3") at that time:


My code that I'm importing:


And my content for that comment:




PS: I only got to know what CSS is a little while ago, so my knowladge about this field is very limited, especially about HTML, so help me in a way any noob would understand please...XD

NOTE: Similar topic's:
http://myanimelist.net/forum/?topicid=564765
http://cdn.myanimelist.net/forum/?topicid=501283
MonsterguyApr 5, 2013 3:33 AM


Apr 5, 2013 3:51 AM

Offline
Oct 2009
7146
Thanks for the great inspiration.
The most important things in life is the people that you care about
Apr 5, 2013 4:42 AM

Offline
Oct 2009
7146
Monsterguy said:
OK, so I want to know if it's possible to hover over a row and "More" function opens itself ???


I don't think you can do that. Since the more button is hooked to a JavaScript function which generate the 'more' content after you clicked it, and put it in the container class .borderRBL.
It does not exist before you clicked it. CMIIW.

Monsterguy said:

There is just one thing I want to correct, why while you hover over a row, a preview pops up as it should, but not the content that's inside "More" function (more precisely I want Comments) !!!


For these extra tab 'Comments' I think you can use the turnaround/alternative method using CSS pseudo-class (:after) right after 'tags' selector.

The problem is probably you have to use the same method with the anime cover art, you have to edit each content individually by CSS. It is easier using 'Tags' as 'comments' since you can work around in one page with your list.
The most important things in life is the people that you care about
Apr 5, 2013 1:09 PM

Offline
Dec 2012
147
azzuRe said:

I don't think you can do that. Since the more button is hooked to a JavaScript function which generate the 'more' content after you clicked it, and put it in the container class .borderRBL.
It does not exist before you clicked it. CMIIW.


What about using PHP here, is that even possible ???

Reference to: http://myanimelist.net/forum/?topicid=519341

PHP like:


azzuRe said:

For these extra tab 'Comments' I think you can use the turnaround/alternative method using CSS pseudo-class (:after) right after 'tags' selector.

The problem is probably you have to use the same method with the anime cover art, you have to edit each content individually by CSS. It is easier using 'Tags' as 'comments' since you can work around in one page with your list.


Yeah, I also think using pseudo-class (:after) as you said would be an option/alternative, but than for each comment you would need to write a comment code into CSS directly (a pain in the a**, if you ask me). Also, I want youtube videos like openings and endings of anime, what is not an option with Tags !!!

azzuRe said:
Thanks for the great inspiration.


BTW, thank you very much for the reply, why first I thought I'm the only one who likes this idea of "new" PREVIEW design (crazy...XD), but I'm glad I'm not...hehehe


Apr 5, 2013 9:29 PM
Offline
Jul 2010
12
I'm using Opera, and I can't open my list when I'm using this. Does'nt work with Opera, or there's something I can do? Please help :( .
Apr 12, 2013 11:40 AM

Offline
Feb 2010
11294
Cyber_Zero said:
I'm using Opera, and I can't open my list when I'm using this. Does'nt work with Opera, or there's something I can do? Please help :( .


I didn't check or know it didn't work in Opera. I am planning to update this whole section eventually but way too busy lately, check back at the end of the week or next week.
Apr 12, 2013 3:41 PM
Offline
Jul 2010
12
Shishio-kun said:
Cyber_Zero said:
I'm using Opera, and I can't open my list when I'm using this. Does'nt work with Opera, or there's something I can do? Please help :( .


I didn't check or know it didn't work in Opera. I am planning to update this whole section eventually but way too busy lately, check back at the end of the week or next week.


Thank you. :)
Apr 21, 2013 2:39 PM

Offline
May 2012
1921
Is it possible to add a background image to the preview?


Wanted to have the dvd cover being displayed in the mid of the pic.
I dont seem to get it right, maybe you can help me xD
Apr 22, 2013 1:15 AM

Offline
Dec 2012
147
SylakentH_ said:
Is it possible to add a background image to the preview?


Wanted to have the dvd cover being displayed in the mid of the pic.
I dont seem to get it right, maybe you can help me xD


It's definitly possible, but because there are so many possibilities (hide, animetitle or any other nth element with the following 2 functions: before, after) of implementing it, I would really need your entire CSS code for that, so PM me your CSS code if you want me to help you on this...


Apr 22, 2013 3:06 AM

Offline
Jan 2012
1578
SylakentH_ said:
Is it possible to add a background image to the preview?


Wanted to have the dvd cover being displayed in the mid of the pic.
I dont seem to get it right, maybe you can help me xD

For anime list, right?
Apr 22, 2013 4:37 AM

Offline
Feb 2010
11294
Monsterguy said:
I would really need your entire CSS code for that, so PM me your CSS code if you want me to help you on this...


Unless his lists set to private, you can look at or take his code with Firefox add-on Firebug. The recent Firefox updates featuring Inspect Element also let you do this when you right-click their list (go to Style Editor). Chrome has a similar tool but it goes down sometimes and isn't as intuitive imo. Opera has its own Firebug "Dragonfly", I think.
Apr 22, 2013 8:01 AM

Offline
May 2012
1921
Hahaido said:

For anime list, right?


ahh thanks a lot , let's see if I'm able to use it for my next layout.


Hope it didnt take a lot of effort to answer my question, since I'm not sure if I can use it. :)
Apr 23, 2013 5:58 PM

Offline
Dec 2012
147
Shishio-kun said:
Monsterguy said:
I would really need your entire CSS code for that, so PM me your CSS code if you want me to help you on this...


Unless his lists set to private, you can look at or take his code with Firefox add-on Firebug. The recent Firefox updates featuring Inspect Element also let you do this when you right-click their list (go to Style Editor). Chrome has a similar tool but it goes down sometimes and isn't as intuitive imo. Opera has its own Firebug "Dragonfly", I think.


Well, I know how to look at codes(!!!), but I suspected that it was some other list/layout he was talking about. That's why my main point was, me implying, I could help him insert it on any list he would want, however he would want !!!

To be precise, I wanted to point it out to him, with CSS only, this is possible, and if he does not know how to, I could help him, although different lists have different ways of implementing things !!!

I thought it was logical to assume he did not want it specificly for his current anime or manga list (my bad if my logic was bad here). Precisely because of that he wanted to know in general if it's possible to insert such a background to list's preview, otherwise he could specify he needs it for his current anime or manga list. Isn't that so ???

I hope now with this explanation you will understand my reasoning for why I asked for CSS code...

_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _


I hope I didn't complicate things to you instead, with all the blabbering in this post...:XD


Apr 23, 2013 6:31 PM

Offline
Feb 2010
11294
Oh ok. I only told you that because you said "I would really need your entire CSS code for that, so PM me your CSS code if you want me to help you on this..." that means "PM me your current layout's CSS" to me. When people say "your CSS" they almost always mean one you're currently using. So I assume you're asking him to PM you his current layout because you didn't know how to view the code yourself.
Apr 24, 2013 1:20 AM

Offline
Dec 2012
147
Shishio-kun said:
Oh ok. I only told you that because you said "I would really need your entire CSS code for that, so PM me your CSS code if you want me to help you on this..." that means "PM me your current layout's CSS" to me. When people say "your CSS" they almost always mean one you're currently using. So I assume you're asking him to PM you his current layout because you didn't know how to view the code yourself.


As for me I admire your approach to help others !!!

Surprisingly, your view on things is really similar to mine (we both seek inspiration in other web pages/games, blogs as well as artistic works, and are able to implement things on myanimelist layout similar to how they are presented there). Although you are better at doing things like those (with more knowledge) as well as expressing yourself and explaining things to others, what has never been my strong point...
MonsterguyApr 24, 2013 1:24 AM


Apr 27, 2013 4:32 PM

Offline
Feb 2010
11294
Monsterguy said:


Surprisingly, your view on things is really similar to mine (we both seek inspiration in other web pages/games, blogs as well as artistic works, and are able to implement things on myanimelist layout similar to how they are presented there). Although you are better at doing things like those (with more knowledge) as well as expressing yourself and explaining things to others, what has never been my strong point...


Cool I like to hear I'm not the only one who wants to make layouts based on games and web pages, I can't really think of a different way to get inspired honestly so I have no clue how others make originals lol. With more experience and making things you'll be able to think of ways to make stuff you have in mind it takes time. After 3 years of this group I finally know how to make my Visual Novel list more like how I envisioned it not what I settled on in 2010 which was still nice but not perfect... also if you like game inspired designs look at my 2011 World of Moecraft layout on my blog!

http://myanimelist.net/blog.php?eid=719986

I used graphics ripped from the game and put in-jokes and references even! It could still be polished graphically in a couple areas, and fixed up for lag issues too.
May 8, 2013 1:14 PM

Offline
Nov 2012
15
need help adding a fade in and out transition for the preview box. :)

I was able to somehow make it using animations (since I can't seem to make transitions work), but there's no fade out and it has to fade in everytime I hover on a new entry.

here:


any idea if I can just use transitions?
May 18, 2013 8:33 AM

Offline
May 2012
518
I don't get it.
I followed al steps, but when i saved it all it turned out like this:

That the image is not showing.. Well its showing but not in the right section..
Can someone help me with that? i would appreciate it ^.^
My deviantART :
Don't get cocky there !
May 18, 2013 10:36 AM

Offline
Feb 2010
11294
xXwendyXx3 said:
I don't get it.
I followed al steps, but when i saved it all it turned out like this:

That the image is not showing.. Well its showing but not in the right section..
Can someone help me with that? i would appreciate it ^.^


You didn't follow the first step at all. You have an anime list, but I can see in your CSS you did not use the anime import from step 1, you're using a manga list import.
May 18, 2013 11:11 AM

Offline
May 2012
518
Shishio-kun said:
xXwendyXx3 said:
I don't get it.
I followed al steps, but when i saved it all it turned out like this:

That the image is not showing.. Well its showing but not in the right section..
Can someone help me with that? i would appreciate it ^.^


You didn't follow the first step at all. You have an anime list, but I can see in your CSS you did not use the anime import from step 1, you're using a manga list import.

Ohh, now i get it. I think i didn't read it right.. hehe ^__^
Thank you very much :).
My deviantART :
Don't get cocky there !
Jun 10, 2013 9:06 PM

Offline
May 2013
10
THANK YOU!!! \(^3^)/
Jun 25, 2013 5:46 AM

Offline
Jan 2009
92493
hello the dvd covers are not showing correctly for me i think this are the codes that has errors

@import url(http://dl.dropbox.com/u/49469857/MAL/premade/anime.css);
@import url(http://dl.dropbox.com/u/49469857/MAL/premade/manga.css);

do you have an updated codes for this? thanks again!
Jun 25, 2013 8:57 AM

Offline
Aug 2009
30
j0x said:
hello the dvd covers are not showing correctly for me i think this are the codes that has errors

@import url(http://dl.dropbox.com/u/49469857/MAL/premade/anime.css);
@import url(http://dl.dropbox.com/u/49469857/MAL/premade/manga.css);

do you have an updated codes for this? thanks again!

They are working fine but you can't add both of them in a single layout.
If you have only one layout then you need to create one more for manga list, after that you need to add first code in anime and second code in manga layout or else it won't work correctly.

Taken from Beginner's tutorial FAQ
Shishio-kun said:
Question: How do I make a separate layout for my manga list?

Answer:


More info here http://myanimelist.net/forum/?topicid=200320
d3v4st4t3Jun 25, 2013 9:55 AM

Jun 25, 2013 3:39 PM

Offline
Jan 2009
92493
@d3v4st4t3

thanks i will try to make a another layout for the mangalist then

EDIT:

it works thanks!!!
Jun 29, 2013 1:22 PM

Offline
Feb 2013
21
Hi guys, I've followed everything but none of the covers are showing for anything in the list. There's a pop up for the tags only but I don't have anyhting in them yet, what am I doing wrong? :(

http://myanimelist.net/animelist/Gwabanaba

Jun 29, 2013 4:58 PM

Offline
Feb 2010
11294
Gwabanaba said:
Hi guys, I've followed everything but none of the covers are showing for anything in the list. There's a pop up for the tags only but I don't have anyhting in them yet, what am I doing wrong? :(

http://myanimelist.net/animelist/Gwabanaba





Its cuz before the COVER AREA code you have

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99

delete all of this line and it should work. btw that same line has caused problems on other layouts, and if its on one of the layouts posted in this club I'd like to edit it out. Do you know exactly what topic or person you got your premade layout code from (or that line from)?
Jun 29, 2013 7:02 PM

Offline
Feb 2013
21
Shishio-kun said:
Gwabanaba said:
Hi guys, I've followed everything but none of the covers are showing for anything in the list. There's a pop up for the tags only but I don't have anyhting in them yet, what am I doing wrong? :(

http://myanimelist.net/animelist/Gwabanaba





Its cuz before the COVER AREA code you have

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99

delete all of this line and it should work. btw that same line has caused problems on other layouts, and if its on one of the layouts posted in this club I'd like to edit it out. Do you know exactly what topic or person you got your premade layout code from (or that line from)?

Everything on my layout is from you, it's different bits and pieces lol. It's the basic layout. So I have to choose between rounded corners and the covers?

I moved the rounded corners code to the end and it's working now.
GwabanabaJun 29, 2013 7:10 PM
Jun 29, 2013 8:16 PM

Offline
Feb 2010
11294
Gwabanaba said:
Shishio-kun said:
Gwabanaba said:
Hi guys, I've followed everything but none of the covers are showing for anything in the list. There's a pop up for the tags only but I don't have anyhting in them yet, what am I doing wrong? :(

http://myanimelist.net/animelist/Gwabanaba





Its cuz before the COVER AREA code you have

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99

delete all of this line and it should work. btw that same line has caused problems on other layouts, and if its on one of the layouts posted in this club I'd like to edit it out. Do you know exactly what topic or person you got your premade layout code from (or that line from)?

Everything on my layout is from you, it's different bits and pieces lol. It's the basic layout. So I have to choose between rounded corners and the covers?

I moved the rounded corners code to the end and it's working now.


You don't have to choose between anything, just take out the line I said to delete. Which is still in your CSS, along with two others that start with read more at so take it out or else it will cause more problems for stuff you add in the future. Do you happen to remember what exact topic you got those lines of text from tho (the ones that start with read more at)? This one:

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99
Shishio-kunJun 29, 2013 8:31 PM
Jun 29, 2013 8:42 PM

Offline
Feb 2013
21
Shishio-kun said:
Gwabanaba said:
Shishio-kun said:
Gwabanaba said:
Hi guys, I've followed everything but none of the covers are showing for anything in the list. There's a pop up for the tags only but I don't have anyhting in them yet, what am I doing wrong? :(

http://myanimelist.net/animelist/Gwabanaba





Its cuz before the COVER AREA code you have

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99

delete all of this line and it should work. btw that same line has caused problems on other layouts, and if its on one of the layouts posted in this club I'd like to edit it out. Do you know exactly what topic or person you got your premade layout code from (or that line from)?

Everything on my layout is from you, it's different bits and pieces lol. It's the basic layout. So I have to choose between rounded corners and the covers?

I moved the rounded corners code to the end and it's working now.


You don't have to choose between anything, just take out the line I said to delete. Which is still in your CSS, along with two others that start with read more at so take it out or else it will cause more problems for stuff you add in the future. Do you happen to remember what exact topic you got those lines of text from tho (the ones that start with read more at)? This one:

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99


Oops sorry, I thought you were sending me to that link so I got confused lol. Well it's working now thanks :)
Jun 29, 2013 8:52 PM

Offline
Feb 2010
11294
Gwabanaba said:
Shishio-kun said:

You don't have to choose between anything, just take out the line I said to delete. Which is still in your CSS, along with two others that start with read more at so take it out or else it will cause more problems for stuff you add in the future. Do you happen to remember what exact topic you got those lines of text from tho (the ones that start with read more at)? This one:

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99


Oops sorry, I thought you were sending me to that link so I got confused lol. Well it's working now thanks :)


That doesn't answer my question about where you got those lines from tho. I'm going to assume you don't remember. It doesn't appear to be in any layouts or related topics now, so it was probably taken from a topic from a while ago before it was edited if it wasn't someone else's CSS
Shishio-kunJun 29, 2013 9:06 PM
Jun 29, 2013 9:40 PM

Offline
Feb 2013
21
Shishio-kun said:
Gwabanaba said:
Shishio-kun said:

You don't have to choose between anything, just take out the line I said to delete. Which is still in your CSS, along with two others that start with read more at so take it out or else it will cause more problems for stuff you add in the future. Do you happen to remember what exact topic you got those lines of text from tho (the ones that start with read more at)? This one:

Read more at http://myanimelist.net/forum/?topicid=562853#3WHFHhc7MtcDIE6q.99


Oops sorry, I thought you were sending me to that link so I got confused lol. Well it's working now thanks :)


That doesn't answer my question about where you got those lines from tho. I'm going to assume you don't remember. It doesn't appear to be in any layouts or related topics now, so it was probably taken from a topic from a while ago before it was edited if it wasn't someone else's CSS


I was looking but I can't find it. I remember that I copied a code and it came along with it and it happened multiple times with different codes. It happened a total of three times and I already deleted them so I'm not sure which one's they're from sorry :(
Aug 20, 2013 7:47 AM

Offline
Jun 2011
17
the anime titles and images dont match. manga is perfect :(
Aug 20, 2013 8:41 AM

Offline
Feb 2010
11294
drigerm3 said:
the anime titles and images dont match. manga is perfect :(



You did exactly what I said not to do in the first step; reread step 1 and do it correctly this time

Aug 24, 2013 11:43 AM

Offline
Mar 2013
2
I think i've done everything correctly but the mini-review doesn't appear, so i must have done something wrong XD
I tried to change the selector codes, the 6 in 3,4,5,7 even 8 but it doesn't work.
Could you help me please? :(

Thank you for all these amazing guides of yours. :)

Here's my CSS
Aug 24, 2013 1:33 PM

Offline
Feb 2010
11294
Gio-zwempai said:
I think i've done everything correctly but the mini-review doesn't appear, so i must have done something wrong XD
I tried to change the selector codes, the 6 in 3,4,5,7 even 8 but it doesn't work.
Could you help me please? :(

Thank you for all these amazing guides of yours. :)


To clarify: you write the reviews yourself first; they don't appear automatically when you add this CSS.

You don't have any mini-reviews because there doesn't seem to be anything written in your tags, so add your reviews to them first then add this CSS and they'll pop up with the preview pic.
Aug 25, 2013 2:52 AM

Offline
Mar 2013
2
Shishio-kun said:
Gio-zwempai said:
I think i've done everything correctly but the mini-review doesn't appear, so i must have done something wrong XD
I tried to change the selector codes, the 6 in 3,4,5,7 even 8 but it doesn't work.
Could you help me please? :(

Thank you for all these amazing guides of yours. :)


To clarify: you write the reviews yourself first; they don't appear automatically when you add this CSS.

You don't have any mini-reviews because there doesn't seem to be anything written in your tags, so add your reviews to them first then add this CSS and they'll pop up with the preview pic.


Oh, ok. I didn't know that, sorry. Thank you very much for the answer :)
Sep 8, 2013 5:15 AM

Offline
Jul 2010
93
I'm not really a fan of using cover pics, but I have a suggestion.
Using :hover + .hide on bigger list (like five hundred entries or more) can cause some serious lags because browser has too many elements to check.

Couldn't we instead of .hide use #xmenu? I mean the "more" button is already hidden so why not use it?
After some quick changes in your code:

Of course it would require altering files with cover urls, but changing #more to #xmenu isn't that much work.

I haven't seen anything about it on this forum. If this idea was already thought over, then sorry.
Sep 8, 2013 8:11 AM

Offline
Feb 2010
11294
dzikibambus said:
I'm not really a fan of using cover pics, but I have a suggestion.
Using :hover + .hide on bigger list (like five hundred entries or more) can cause some serious lags because browser has too many elements to check.

Couldn't we instead of .hide use #xmenu? I mean the "more" button is already hidden so why not use it?
After some quick changes in your code:

Of course it would require altering files with cover urls, but changing #more to #xmenu isn't that much work.

I haven't seen anything about it on this forum. If this idea was already thought over, then sorry.


Thanks for the suggestion, it hasn't been thought over at all actually, and I am always open to anything that improves the group! Tho with so many ppl using it already and this one not tested enough it can't replace the old :hover hide (which would be optimal if its overall faster). But it could be a extra topic like "If you have more than 500 entries, you can use this trick to make your list faster etc". That would be awesome. Tho I think I use Xmenu for youtube stuff, like on my anime list.

So all you'd have to do is replace the codes from this tutorial with the one in the spoiler, and all the words "#more" in the cover CSS replaced with "#xmenu"?
Reply Disabled for Non-Club Members
Pages (5) [1] 2 3 » ... Last »

More topics from this board

» ❓ Ask for help here + See Frequently Asked Questions ( 1 2 3 4 5 ... Last Page )

Shishio-kun - Apr 15, 2010

7812 by mtsRhea »»
Apr 21, 5:25 AM

» [CSS- MODERN] ⭐ Minimal Dashboard layout by 5cm ~ Compact and convenient! ( 1 2 3 )

Shishio-kun - Sep 4, 2020

121 by Pokitaru »»
Apr 21, 3:25 AM

» [CSS-MODERN] Change list text/font colors on any list layout

Shishio-kun - May 4, 2021

3 by hideso »»
Apr 20, 4:33 PM

» [CSS] [VIDEO GUIDE] ⭐️ How to change fonts on a list layout

Shishio-kun - Jul 15, 2019

17 by hideso »»
Apr 20, 4:03 PM

» [CSS][Modern] ☀️ Endless Summer Layout by Cateinya ( 1 2 3 4 5 ... Last Page )

Cateinya - Aug 18, 2016

309 by hideso »»
Apr 20, 3:56 PM
It’s time to ditch the text file.
Keep track of your anime easily by creating your own list.
Sign Up Login