Avatar billede babynamnam Nybegynder
27. januar 2003 - 21:08 Der er 13 kommentarer og
1 løsning

automatisk centrering!!!!

Jeg har lavet en hjemmeside som passer til 1024 x 768 med en asp dropdown menu, hvor der indtastes kordinater til på hvilket sted menuen skal rulle ned. det virker også fint i 1024 x 768, men det går derimod helt i lort i 800 x 600 da de kordinater jeg har indtastet forskubber menuen ved denne opløsning.
findes der ikke en anden møde at tildele en menu kordinater på sådan at den kan virke i "alle" opløsning. Såden på en måde blive centreret!!

Er der ikke noget der ved lidt om det!!???
Avatar billede websmith Nybegynder
27. januar 2003 - 21:12 #1
Du kan klare det med JavaScript. Dvs. Du kan bruge følgende to for at få størrelsen på browservinduet:

java.awt.Toolkit.getDefaultToolkit().getScreenSize().width;
java.awt.Toolkit.getDefaultToolkit().getScreenSize().height;
Avatar billede oasen Nybegynder
27. januar 2003 - 21:13 #2
Bare et lille spm.: Har du prøvet at formindske browservinduet i en højere opløsning? Det er der trods alt mange, der gør.

I øvrigt tror jeg, du kunne få et bedre svar i www.exp.dk/kat/10/
Avatar billede websmith Nybegynder
27. januar 2003 - 21:13 #3
Dvs. du kan bruge javascript til at checke på størrelsen af vinduet, og så skrive din menu start position derefter.
Avatar billede babynamnam Nybegynder
27. januar 2003 - 21:36 #4
hej websmith,
kan du ikke give et kode eks. på hvordan det gøre her er koden til min menu



function crewin(n)
{
window.open(n, 'a','toolbar=no,directories=no,menubar=no,status=no,resizable=no,scrollbars=yes,width=380,height=500,left=100, top = 100')
}
function crewin2(n)
{
window.open(n, 'a','toolbar=no,directories=no,menubar=no,status=no,resizable=no,scrollbars=no,width=760,height=460,left=0, top = 0')
}
//Sitemap----------------------------------------------------------------------------------
HM_Array1 = [
[120,                          // menu width
118,                 // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Performance Parts","PerformanceParts.asp",1,0,0],
["Dragracing","Dragrace.asp",1,0,0],
["Performance Sider","link.asp",1,0,0],
["Blandet","link.asp",1,0,0]
]

//Kid's Corner--------------------------------------------------------------------------------------------
HM_Array2 = [
[100,                          // menu width
239,                 // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Baggrunde","Baggrunde.asp",1,0,0],
["Animerede Gif's","gif.asp",1,0,0],
["Screen saver","Screen.asp",1,0,0],
["Spil","Spil.asp",1,0,0]
]



//Search----------------------------------------------------------------------------------------
HM_Array3 = [
[100,                          // menu width
348,                 // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],

["Forum","forum/default.asp",1,0,0],
["Gæstebog","gaestebog/default.asp",1,0,0]
]


//Menu-------------------------------------------------------------------------------------
HM_Array4 = [
[100,                          // menu width
432,                        // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Bøger","Bøger.asp",1,0,0],
["Film","Film.asp",1,0,0],
["Musik","Musik.asp",1,0,0],
["Kalendere","kalendere.asp",1,0,0],
["Manualer","Manualer.asp",1,0,0],
["Kataloger","Kataloger.asp",1,0,0],
["Tøj","Toej.asp",1,0,0],
["Tattoos","tattoo.asp",1,0,0],
["Blandet","link.asp",1,0,0]
]

//Menu-------------------------------------------------------------------------------------
HM_Array5 = [
[100,                          // menu width
551,                 // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Harley chat","chat/default.asp",1,0,0]
]

//Menu-------------------------------------------------------------------------------------
HM_Array6 = [
[110,                          // menu width
636,                 // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],

["Forhandlere DK","ForhandlerDK.asp",1,0,0],
["Forhandlere EU","ForhandlerEU.asp",1,0,0],
["Forhandlere US","ForhandlerUS_1.asp",1,0,0],
["Online Shopping","OnLineShopping.asp",1,0,0],
["Klubber DK","Klubber.asp",1,0,0],
["Klubber EU","KlubberEU.asp"],
["Klubber US","KlubberUS_1.asp"],
["Events DK","EventDK.asp",1,0,0],
["Events EU","EventWW.asp",1,0,0],
["Events US","EventWW.asp",1,0,0],
["Værktøj","Vaerktoej.asp",1,0,0],
["Forkromning","Forkromning.asp",1,0,0],
["Sadelmagere","Sadelmager.asp",1,0,0],
["HD Sider DK","hdsider.asp",1,0,0],
["HD Sider WW","hdsider.asp",1,0,0]
]

//Menu-------------------------------------------------------------------------------------
HM_Array7 = [
[100,                          // menu width
722,                 // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Færger","Faeger.asp",1,0,0],
["Bed & Breakfast","Bed.asp",1,0,0],
["Hoteller","Hoteller.asp",1,0,0],
["Kort & Vejviser","Kort.asp",1,0,0],
["Campingpladser","Campingpladser.asp",1,0,0],
["Blandet","Blandet.asp",1,0,0]

]

//Menu-------------------------------------------------------------------------------------
HM_Array8 = [
[100,                          // menu width
842,                          // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Classic Bikes","ClassicBikes.asp",1,0,0],
["Super Bikes","SuperBikes.asp",1,0,0],
["Vintage Bikes","VintageBikes.asp",1,0,0],
["Din Cykel","link.asp",1,0,0]
]


ellers kan jeg sku vist ikke hitte ud af det!:-))
Avatar billede miraculix Nybegynder
28. januar 2003 - 00:32 #5
websmith > de funktioner du har postet er java og ikke javascript.

babynamnam> du kan bruge funktionerne document.body.offsetHeight() og document.body.offsetWidth() til at finde størrelsen på det aktuelle vindue.

hvis du deler med 2 har du midten.

Herefter skal du så trække lidt fra hhv. lægge lidt til for at dine menuer kommer hhv. til venstre og til højre for midten.

F.eks. en menu der skal være 150 pix før midten:

var midt = document.body.offsetWidth() / 2;
menu_left_side = midt - 150;

Du skal muligvis justere lidt, men princippet er som skrevet står...

Jeg lurer på om ikke der er en måde at style de menuer så du ikke behøver at gøre det, men jeg er ikke sikker.
Avatar billede miraculix Nybegynder
28. januar 2003 - 01:30 #6
Et eksempel:

Øverst lige over første menu:

var midt = document.body.offsetWidth() / 2;
var pos = midt - 392; // ca-tal skal sikkert tilrettes lidt.
//Sitemap----------------------------------------------------------------------------------
HM_Array1 = [
[120,                          // menu width
pos,                // left_position
....

og længere nede f.eks.:

pos = midt - 80;
HM_Array4 = [
[100,                          // menu width
pos,                        // left_position
183,                            // top_position
...

længere nede og på den anden side af midten:

pos = midt + 330;
HM_Array8 = [
[100,                          // menu width
pos,                          // left_position
...

osv.

Du skal overveje om menupunkterne skal være lidt smallere i lavere opløsning, og i givet fald tage højde for det også...(så bliver det lidt mere bøvlet)
Avatar billede babynamnam Nybegynder
30. januar 2003 - 19:53 #7
hej miraculix...kan du ikke komme med lidt hjælp til en tungnem!!!:-)....vil du ikke lige smide de der nye kordinator ind i min kode...de behøves selvfølgelig ikke at passe..det skal jeg nok selv ordne. Ny har jeg rodet med det og jeg kan ikke få det til at virke jeg får vist sat dem forkert ind!!!!

på forhånd tak....
Avatar billede miraculix Nybegynder
30. januar 2003 - 21:09 #8
Bare fordi man ikke er en ørn til matematik behøver man ikke være tungnem. Jeg kigger på det..
Avatar billede miraculix Nybegynder
30. januar 2003 - 21:54 #9
Lad os sige at X'erne i følgende to linier er menuerne i hhv. 17 og 11 px opløsning og O er midten:

-----X--O--X-----

--X--O--X--

Menuerne er lige brede, ligger ens i fht. midten, men der er færre pix fra venstre kant til X'erne i linie 2 end i linie 1.
Der er imidlertid lige mange pix fra O'erne til X'erne i begge linier.

Midten er hhv. pos 9 og pos 6. (svarende til 17/2 = 8.5 hhv. 11/2 = 5.5, og så rundet af)

Venstre X er midten - 3
Højre X er midten + 3

I 18 px opløsning bliver venstre X i pos 9 - 3 = 6  højre bliver 9 + 3 = 12
I 12 px opløsning bliver venstre X i pos 6 - 3 = 3  højre bliver 6 + 3 = 9

Tæl selv fra venstre og se at det passer..

Dit script SKAL have tallet i fht. venstre kant.

Derfor er du nødt til at beregne det som beskrevet.
   
Og så den tilrettede kode:


function crewin(n)
{
window.open(n, 'a','toolbar=no,directories=no,menubar=no,status=no,resizable=no,scrollbars=yes,width=380,height=500,left=100, top = 100')
}

function crewin2(n)
{
window.open(n, 'a','toolbar=no,directories=no,menubar=no,status=no,resizable=no,scrollbars=no,width=760,height=460,left=0, top = 0')
}

var midt = document.body.offsetWidth() / 2;

//Sitemap----------------------------------------------------------------------------------
HM_Array1 = [
[120,                          // menu width
midt - 394,                // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Performance Parts","PerformanceParts.asp",1,0,0],
["Dragracing","Dragrace.asp",1,0,0],
["Performance Sider","link.asp",1,0,0],
["Blandet","link.asp",1,0,0]
]

//Kid's Corner--------------------------------------------------------------------------------------------
HM_Array2 = [
[100,                          // menu width
midt - 273,                // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Baggrunde","Baggrunde.asp",1,0,0],
["Animerede Gif's","gif.asp",1,0,0],
["Screen saver","Screen.asp",1,0,0],
["Spil","Spil.asp",1,0,0]
]



//Search----------------------------------------------------------------------------------------
HM_Array3 = [
[100,                          // menu width
midt - 164,                // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],

["Forum","forum/default.asp",1,0,0],
["Gæstebog","gaestebog/default.asp",1,0,0]
]


//Menu-------------------------------------------------------------------------------------
HM_Array4 = [
[100,                          // menu width
midt - 80,                        // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Bøger","Bøger.asp",1,0,0],
["Film","Film.asp",1,0,0],
["Musik","Musik.asp",1,0,0],
["Kalendere","kalendere.asp",1,0,0],
["Manualer","Manualer.asp",1,0,0],
["Kataloger","Kataloger.asp",1,0,0],
["Tøj","Toej.asp",1,0,0],
["Tattoos","tattoo.asp",1,0,0],
["Blandet","link.asp",1,0,0]
]

//Menu-------------------------------------------------------------------------------------
HM_Array5 = [
[100,                          // menu width
midt + 39,                // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Harley chat","chat/default.asp",1,0,0]
]

//Menu-------------------------------------------------------------------------------------
HM_Array6 = [
[110,                          // menu width
midt + 124,                // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],

["Forhandlere DK","ForhandlerDK.asp",1,0,0],
["Forhandlere EU","ForhandlerEU.asp",1,0,0],
["Forhandlere US","ForhandlerUS_1.asp",1,0,0],
["Online Shopping","OnLineShopping.asp",1,0,0],
["Klubber DK","Klubber.asp",1,0,0],
["Klubber EU","KlubberEU.asp"],
["Klubber US","KlubberUS_1.asp"],
["Events DK","EventDK.asp",1,0,0],
["Events EU","EventWW.asp",1,0,0],
["Events US","EventWW.asp",1,0,0],
["Værktøj","Vaerktoej.asp",1,0,0],
["Forkromning","Forkromning.asp",1,0,0],
["Sadelmagere","Sadelmager.asp",1,0,0],
["HD Sider DK","hdsider.asp",1,0,0],
["HD Sider WW","hdsider.asp",1,0,0]
]

//Menu-------------------------------------------------------------------------------------
HM_Array7 = [
[100,                          // menu width
midt + 210,                // left_position
183,                              // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Færger","Faeger.asp",1,0,0],
["Bed & Breakfast","Bed.asp",1,0,0],
["Hoteller","Hoteller.asp",1,0,0],
["Kort & Vejviser","Kort.asp",1,0,0],
["Campingpladser","Campingpladser.asp",1,0,0],
["Blandet","Blandet.asp",1,0,0]

]

//Menu-------------------------------------------------------------------------------------
HM_Array8 = [
[100,                          // menu width
midt + 330,                          // left_position
183,                            // top_position
"#ffffff",                        // font_color
"#333333",                      // mouseover_font_color
"#333333",                      // background_color
"#ff9133",                      // mouseover_background_color
"#cccccc",                        // border_color
"#cccccc",                      // separator_color
,                            // top_is_permanent
,                            // top_is_horizontal
,                            // tree_is_horizontal
,                            // position_under
,                            // top_more_images_visible
,                            // tree_more_images_visible
,                        // evaluate_upon_tree_show
,                        // evaluate_upon_tree_hide
,                              // right_to_left
0],
["Classic Bikes","ClassicBikes.asp",1,0,0],
["Super Bikes","SuperBikes.asp",1,0,0],
["Vintage Bikes","VintageBikes.asp",1,0,0],
["Din Cykel","link.asp",1,0,0]
]
Avatar billede miraculix Nybegynder
30. januar 2003 - 21:57 #10
Hov.

I linierne
I 18 px opløsning bliver venstre X i pos 9 - 3 = 6  højre bliver 9 + 3 = 12
I 12 px opløsning bliver venstre X i pos 6 - 3 = 3  højre bliver 6 + 3 = 9

skulle der have stået:
I 17 px opløsning bliver venstre X i pos 9 - 3 = 6  højre bliver 9 + 3 = 12
I 11 px opløsning bliver venstre X i pos 6 - 3 = 3  højre bliver 6 + 3 = 9

Men det er egentlig ligegyldigt for princippet. (Man runder jo af når man finder midten)
Avatar billede babynamnam Nybegynder
04. februar 2003 - 15:57 #11
hej miraculix

Når jeg prøver den kode du har sendt mig så virker det ikke. Det er som om "midt +" funktionen ikke findes eller hva....
hvis du kunne gi´mig din email så kan jeg sende dig menu filerne så kunne det være at du ENDNU en gang vil kikke lidt på det!!!
Avatar billede miraculix Nybegynder
04. februar 2003 - 17:10 #12
Det kan jeg godt.
Du kan sende en mail til eksp@greencard.dk
Avatar billede miraculix Nybegynder
04. februar 2003 - 20:30 #13
Til andre: Fejlen i koden ovenfor var at offsetWidth ikke er en metode men en egenskab, så linien:
var midt = document.body.offsetWidth() / 2;
skulle have været:
var midt = document.body.offsetWidth / 2;

/mvh
Avatar billede babynamnam Nybegynder
04. februar 2003 - 20:50 #14
hey miraculix....du er da bare den største hjælper....her er så de vel fortjente point...ikke et point for meget...og endnu engang tak for hjælpen

MVH/ Babynamnam
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester