Replies

Oct 15, 2012 13 years ago
Shalashaska
made a huge mistake
User Avatar
Manta Ray_510

UPDATE: got the bloody links to work! But the page still jumps =S

I am trying to sort it so that Rifle's profile has all the info: story; art and credits in one scroll box, similar to what I've done on Shalashaska's profile, however his coding is rough to say the least, and to be able to take the text links out of the div box and rotate them I've some how lost the ability to change from one section to another.

The anchor links must still work as when I press a link the page drops down to where the text would start: Story Part I takes me to the top of 'It'll take more than words and guns' and Story Part II takes me a little bit farther. Artwork takes me farther still, Credits takes me too the top again.

Obviously that's not what I want =|

What I want is the text available in the text box to change and to not have the page jump about, I've got so far, but I'm now utterly out of my depth and confused.

The full code

<style type="text/css"> {background: transparent; width: 200px; height: 250px; position: absolute; top: 50px; left: 5px;} a { display: none; } h1 { font-size: 16px; color: ; font-weight: bold; font-family:Georgia; margin-top: 0px; margin-bottom: 3px; } h2 { display:none;} - a:link,a:visited {font-size: 10px; color:; font-weight: bold;text-shadow: 2px 1px 1px black;} a:hover {color:; opacity:0.6;} {background-image: url(http://www.upload.ee/image/2723164/rifleoverlay.png); width:654px;height:491px;position:absolute; left:350px; top: 140px;z-index:3;} body {width:982px!important;} /*PET INFO*/ {position:absolute; top:1500px; left:1480px; width:250px; height:100px; z-index:2; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg);} .l1{position:relative;left:500px; background-color:transparent; padding-left:4px; margin-bottom:6px; width:100px; height:15px;} .l2 {position:relative;left:520px; top:3px; background-color:transparent; padding-left:4px; margin-bottom:6px; width:100px; height:15px;} .l3 {position:relative;left:500px; top:6px; background-color:transparent; padding-left:4px; margin-bottom:6px; width: 100px; height:15px;} .l4 {position:relative;left:510px; top:8px; background-color:transparent; padding-left:4px; margin-bottom:6px; width: 100px; height:15px;} {position:absolute; width:297px;height:240px; overflow-x: hidden;overflow-y:auto;font-size:10px;color:;background-color:;opacity;0.5:padding:20px;z-index:2;text-align:justify;} {position:absolute; text-align:justified;width:300px;left:1450px;top:790px;height:240px; overflow-x: hidden;overflow-y:hidden;font-size:10px;color:;background-color:;opacity;0.5:padding:20px;z-index:2;text-align:justify;} {position: absolute;left: -700px;top: -455px;} {position: absolute;left: -450px;top: 0px;width:1000px;color:;} .pet_name{display:none;} .pet_wco_info_date{display:none;} .pet_age_info_date{display:none;} .owner{position: absolute;left: 560px;top: 112px;color:;font-size:10px;font-family:arial;font-weight:bold;} .pet_color_info{position: absolute;left: 420px;top: 112px;color: ;font-size:10px; font-family:arial;font-weight:bold;} {display:none;} {display:none;} .pet_spotlight {position:absolute;text-align:center;width:200px;left:820px;top:100px;height:328px; overflow-x: hidden;overflow-y:hidden;font-size:11px;} {display:none;} {display:none;} /*PET TREASURE*/ {position: absolute;left:360px;top:152px;height:252px;width:289px;overflow-x:hidden;overflow-y:auto;background-color:transparent;opacity:0.6;z-index:1} :hover {position: absolute;left:360px;top:152px;height:252px;width:289px;overflow-x:hidden;overflow-y:auto;background-color:transparent;opacity: 1;z-index:4} .treasure_item {width: 54px; height: 54px; margin: 0px 0px 0px 0px; padding: 0px; border:0px;} .treasure_item img {width:54px; height:54px;filter: alpha(opacity=100); opacity:1;border:1px;border-style:solid;border-color:black;z-index:1;} .treasure_item_name {display:none;} /*STRUCTURE*/ {display: none} {height: 100% !important} , , , , {display:none} , , , {background:none;} , , {display:none;} , , , {display: block; overflow-x:hidden; overflow-y:auto; padding:3px;} , , , {width: 286px; height: 220px; margin: 0px;padding:3px;} body {background: transparent url(http://www.upload.ee/image/2723162/rifleprofile.png) no-repeat top left; width:1000px; height: 853px} html {background: url(http://www.upload.ee/image/2723150/rilfebg.gif) repeat top left;padding-top:-2px;} </style>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus suscipit, lectus blandit porttitor condimentum, est lacus dignissim purus, sed posuere lacus risus a tellus. Nam tempus, justo ac malesuada pellentesque, metus leo posuere nisl, a blandit orci urna non velit. Curabitur metus justo, ullamcorper feugiat convallis eget, mattis at lorem. Vivamus id libero eget orci scelerisque viverra sed id lectus. Sed suscipit sem aliquam mauris adipiscing posuere fermentum id orci. Proin interdum congue porta. Ut est nibh, ornare ac posuere id, porta et erat.

Nullam nisi leo, feugiat lobortis vehicula ut, fringilla ut enim. Sed augue magna, tristique quis porttitor a, suscipit eu diam. Phasellus ullamcorper, augue sit amet auctor iaculis, nisl lacus pulvinar tortor, eget scelerisque justo turpis vel nunc. Quisque interdum sem ut nibh vestibulum viverra. Ut a elit nec nulla dapibus auctor id in lectus. Cras et enim erat. Proin ornare convallis pretium. Duis vel viverra neque. Mauris fermentum ultrices fringilla. In non felis id justo tempor ultrices.

Vivamus mollis euismod enim in mattis. Aliquam a urna lorem. Nam non dolor nunc. Sed dapibus, enim at accumsan bibendum, diam est hendrerit erat, eget varius justo dui quis libero. Morbi risus odio, varius id pellentesque id, feugiat in justo. In adipiscing scelerisque erat nec venenatis. Curabitur nulla augue, mollis nec consectetur facilisis, laoreet in lorem. Nunc convallis vehicula est, at adipiscing arcu scelerisque sit amet. Cras sit amet tortor vel ligula sodales ultrices. Morbi eget erat in dolor condimentum interdum. Vivamus at neque tortor. Aliquam condimentum nunc non neque semper venenatis id quis nisi. Nulla eget ante non purus fringilla tincidunt nec quis ipsum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque ut diam non purus dictum mattis vitae sit amet justo. Nunc ut arcu dui, at euismod velit.

Quisque a ante massa, non rhoncus turpis. Sed sem leo, porttitor sit amet vestibulum nec, vestibulum quis felis. Nulla interdum molestie lorem ac suscipit. Nam eu nisl eros. Nullam hendrerit turpis et magna porta mattis. In lobortis ultricies pellentesque. Aliquam eu neque purus, ac rhoncus tellus. Pellentesque mi metus, porttitor ac egestas nec, accumsan et lectus.

Nullam sagittis, lectus et tincidunt auctor, magna ipsum pellentesque urna, laoreet porta orci est at augue. Donec massa arcu, faucibus vulputate dignissim eget, consectetur eu ligula. Donec sapien est, sollicitudin in sollicitudin ac, placerat eget arcu. Suspendisse eget justo magna, fermentum tristique odio. Integer non quam erat, et imperdiet arcu. Sed eros arcu, lobortis sit amet accumsan in, auctor nec libero. Nullam at condimentum erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse posuere pellentesque mi, a feugiat leo viverra quis. Pellentesque blandit neque a nibh faucibus adipiscing non vel mauris. Vestibulum molestie lobortis ligula, sed dignissim augue aliquet quis. Pellentesque eu magna non nisl mattis lobortis et vitae quam. Maecenas quam odio, faucibus eu egestas eget, consequat vel leo. Integer egestas ipsum ac enim tempor auctor.

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT

The bit I'm having trouble with /*PET INFO*/ {position:absolute; top:1500px; left:1480px; width:250px; height:100px; z-index:2; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg);} .l1{position:relative;left:500px; background-color:transparent; padding-left:4px; margin-bottom:6px; width:100px; height:15px;} .l2 {position:relative;left:520px; top:3px; background-color:transparent; padding-left:4px; margin-bottom:6px; width:100px; height:15px;} .l3 {position:relative;left:500px; top:6px; background-color:transparent; padding-left:4px; margin-bottom:6px; width: 100px; height:15px;} .l4 {position:relative;left:510px; top:8px; background-color:transparent; padding-left:4px; margin-bottom:6px; width: 100px; height:15px;}

{position:absolute; width:297px;height:240px; overflow-x: hidden;overflow-y:auto;font-size:10px;color:;background-color:;opacity;0.5:padding:20px;z-index:2;text-align:justify;}

{position:absolute; text-align:justified;width:300px;left:1450px;top:790px;height:240px; overflow-x: hidden;overflow-y:hidden;font-size:10px;color:;background-color:;opacity;0.5:padding:20px;z-index:2;text-align:justify;}

, , , {display: block; overflow-x:hidden; overflow-y:auto; padding:3px;}

, , , {width: 286px; height: 220px; margin: 0px;padding:3px;}

</style>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus suscipit, lectus blandit porttitor condimentum, est lacus dignissim purus, sed posuere lacus risus a tellus. Nam tempus, justo ac malesuada pellentesque, metus leo posuere nisl, a blandit orci urna non velit. Curabitur metus justo, ullamcorper feugiat convallis eget, mattis at lorem. Vivamus id libero eget orci scelerisque viverra sed id lectus. Sed suscipit sem aliquam mauris adipiscing posuere fermentum id orci. Proin interdum congue porta. Ut est nibh, ornare ac posuere id, porta et erat.

Nullam nisi leo, feugiat lobortis vehicula ut, fringilla ut enim. Sed augue magna, tristique quis porttitor a, suscipit eu diam. Phasellus ullamcorper, augue sit amet auctor iaculis, nisl lacus pulvinar tortor, eget scelerisque justo turpis vel nunc. Quisque interdum sem ut nibh vestibulum viverra. Ut a elit nec nulla dapibus auctor id in lectus. Cras et enim erat. Proin ornare convallis pretium. Duis vel viverra neque. Mauris fermentum ultrices fringilla. In non felis id justo tempor ultrices.

Vivamus mollis euismod enim in mattis. Aliquam a urna lorem. Nam non dolor nunc. Sed dapibus, enim at accumsan bibendum, diam est hendrerit erat, eget varius justo dui quis libero. Morbi risus odio, varius id pellentesque id, feugiat in justo. In adipiscing scelerisque erat nec venenatis. Curabitur nulla augue, mollis nec consectetur facilisis, laoreet in lorem. Nunc convallis vehicula est, at adipiscing arcu scelerisque sit amet. Cras sit amet tortor vel ligula sodales ultrices. Morbi eget erat in dolor condimentum interdum. Vivamus at neque tortor. Aliquam condimentum nunc non neque semper venenatis id quis nisi. Nulla eget ante non purus fringilla tincidunt nec quis ipsum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque ut diam non purus dictum mattis vitae sit amet justo. Nunc ut arcu dui, at euismod velit.

Quisque a ante massa, non rhoncus turpis. Sed sem leo, porttitor sit amet vestibulum nec, vestibulum quis felis. Nulla interdum molestie lorem ac suscipit. Nam eu nisl eros. Nullam hendrerit turpis et magna porta mattis. In lobortis ultricies pellentesque. Aliquam eu neque purus, ac rhoncus tellus. Pellentesque mi metus, porttitor ac egestas nec, accumsan et lectus.

Nullam sagittis, lectus et tincidunt auctor, magna ipsum pellentesque urna, laoreet porta orci est at augue. Donec massa arcu, faucibus vulputate dignissim eget, consectetur eu ligula. Donec sapien est, sollicitudin in sollicitudin ac, placerat eget arcu. Suspendisse eget justo magna, fermentum tristique odio. Integer non quam erat, et imperdiet arcu. Sed eros arcu, lobortis sit amet accumsan in, auctor nec libero. Nullam at condimentum erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse posuere pellentesque mi, a feugiat leo viverra quis. Pellentesque blandit neque a nibh faucibus adipiscing non vel mauris. Vestibulum molestie lobortis ligula, sed dignissim augue aliquet quis. Pellentesque eu magna non nisl mattis lobortis et vitae quam. Maecenas quam odio, faucibus eu egestas eget, consequat vel leo. Integer egestas ipsum ac enim tempor auctor.

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT

Please ping! [edit] And I seem to have 41 { but 42 } but I can't see where the missing one is =| I found the 'extra' } but deleting it messes with the profile ==; halp. I did something >>

Oct 15, 2012 13 years ago
Silverfish
is a survivor
User Avatar
Xingese

Whatever you did it cuts out for me and refuses to scroll. So, not successful. Sorry. x/

Art by p-sebae ❤️
| | -Night Mode- Shengui Guo Custom CSS [v2.0]

Looking to adopt a December 31st, 1969 glitched date pet

Oct 15, 2012 13 years ago
Shalashaska
made a huge mistake
User Avatar
Manta Ray_510

Frig. Screen sizes I didn't think of those. [edit] Can you screen shot I'm not sure what bit you mean?

Oct 15, 2012 13 years ago
Silverfish
is a survivor
User Avatar
Xingese

I can try to...look into this?

[edit] it's stuck like this permanently

[edit] Because you set body's position to fixed?? [sub]wtf don't do that[/sub]

Art by p-sebae ❤️
| | -Night Mode- Shengui Guo Custom CSS [v2.0]

Looking to adopt a December 31st, 1969 glitched date pet

Oct 15, 2012 13 years ago
Shalashaska
made a huge mistake
User Avatar
Manta Ray_510

OMFG let me connect Subeta! It would be more useful if I knew what you were seeing. The whole image fits on my screen so I don't need to scroll, I forgot about it and to fix something set the body to fixed, that's obviously not helpful to someone who needs to scroll, I think I can work around it but I can't be sure until I know what's wrong. Okay you have a thinner screen than I, I think I know how to fix that. I can barely connect to the site now though, so it'll have to wait.

Please log in to reply to this topic.