Nomax5 Posted June 8, 2006 Share Posted June 8, 2006 Hi I’m really stuck with this:I want to create like a name generation idea thing by having a list of verbs and a list of nouns in 2 lists that scroll independentlyExampleList 1 List 2Black DevilRed FishAngry NannyHappy DogVulgar JungleWhat I would like to do is have the nouns and verb pretty close together and to be able to scroll each list so scrolling list 1 down 2 may look like thisList 1 List 2...... Devil...... LemonBlack NannyRed DogAngry JungleThe problem is I don’t know where to start I’ve fiddled with css but a scroll bar ends up between the lists I’m looking for ideas mainly how would you approach this?CheersRoy Quote Link to comment Share on other sites More sharing options...
nogray Posted June 8, 2006 Share Posted June 8, 2006 Pretty interesting problem....Here is a little trick that works in IE and FF, doesn't work in Opera. I used the dir="rtl" in the first div so the scroll bar will move to the left side of the div. This way it's not between the two lists.[code]<style> .list {width:100px; height:100px; overflow:auto; float:left; padding:3px;}</style><div class="list" dir="rtl">List 1<br />Black<br />Red<br />Angry <br />Happy<br />Vulgar<br /></div><div class="list">List 2<br />Devil<br />Fish<br />Nanny<br />Dog<br />Jungle<br /></div>[/code] Quote Link to comment Share on other sites More sharing options...
Nomax5 Posted June 8, 2006 Author Share Posted June 8, 2006 Nogray That is absolutely fantastic just what I needed it’s perfect !!It’s people like you that make this website so great !Thank you so much Quote Link to comment Share on other sites More sharing options...
Nomax5 Posted June 8, 2006 Author Share Posted June 8, 2006 Actually lol… Now I’ve increased the font size and made another slight problemIs there a way to set the amount it scrolls So it scrolls in steps of so many pixels So the words line up.I’ve been looking around a solution… if I find one I’ll post it here Quote Link to comment Share on other sites More sharing options...
nogray Posted June 8, 2006 Share Posted June 8, 2006 If you want to make it scrolls in steps, you gotta make your own scroll bar using javascript. It'll be a bit complicated and you gotta test it from IE and FF (work differently).Here is a simple logic that might workin your list, each item should be an element with and id (like <div id="right_1">Text</div><div id="right_2">Text</div>etc...)create two images to represent the scroll arrows.When the top arrow is clicked, you'll need to check how many clicks it's been (keep a counter in javascript) and than scroll into view the corresponding element from that click to the top.You can use scrollIntoView() function to scroll the element [a href=\"http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/scrollintoview.asp\" target=\"_blank\"]http://msdn.microsoft.com/library/default....ollintoview.asp[/a]do the same with the bottom arrow, but you'll need to scroll the previous element into view. Quote Link to comment Share on other sites More sharing options...
Nomax5 Posted June 8, 2006 Author Share Posted June 8, 2006 Thanks once again... I'll have to fiddle with javascript meanwhile it's not so bad.works well with mousewheel[a href=\"http://www.playname.com/index.php?option=com_content&task=view&id=13&Itemid=30\" target=\"_blank\"]http://www.playname.com/index.php?option=c...id=13&Itemid=30[/a] Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.