Klapsammen menu virker ikke

[Kurt Hansen]

Det der lille ikon med tre vandrette streger, som kommer frem når siden
formindskes, virker ikke.

Når jeg holder musen hen over, så siger den "javascript:void(0);" og at
klikke på det har ingen virkning.

Se http://www.danacord.com/ny/index.html

[Kurt Hansen]

Post by Kurt Hansen
Det der lille ikon med tre vandrette streger, som kommer frem når siden
formindskes, virker ikke.
Når jeg holder musen hen over, så siger den "javascript:void(0);" og at
klikke på det har ingen virkning.
Se http://www.danacord.com/ny/index.html

I koden er der følgende:

<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>

- og

<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}

[Jan Hansen]

Post by Kurt Hansen
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
- og
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}

Hvilket absolut intet har med det at gøre...
Der må være noget helt galt med din professionelle editor, hvis ikke
den kan vise, hvor fejlen ligger. I mit gratis program, er resten af
siden rødt efter linie 67 i http://www.danacord.com/ny/about.html ,
hvor der står
@media screen and () {
Heraf kan man lære, at den linie dur ikke. Ved at rette til f.eks
@media screen and (max-width: 1075px) {
virker menuen igen.

Bortset fra det, så skal du nok selv tegne sådan en burger, eller finde
en gratis på nettet. Det FontAwesome, du linker til på linie 8, er ikke
noget, det er tilladt at bruge, uden der skal stå "Af hjertet tak..."
over hele skærmen. Det du bruger fra linket er i virkeligheden dette css:

.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.fa-bars:before {
content: "\f0c9";
}

og så en tegning af en burger:

<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars" class="svg-inline--fa fa-bars fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg>

Burgeren kan hentes alene på
https://fontawesome.com/icons/bars?style=solid

Vejlednigen til at tegne en mage til selv er her,
https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths

[Kurt Hansen]

Post by Jan Hansen

Post by Kurt Hansen
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
- og
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}

Hvilket absolut intet har med det at gøre...
Der må være noget helt galt med din professionelle editor, hvis ikke
den kan vise, hvor fejlen ligger. I mit gratis program, er resten af
siden rødt efter linie 67 i http://www.danacord.com/ny/about.html ,
hvor der står
@media screen and () {
Heraf kan man lære, at den linie dur ikke. Ved at rette til f.eks
@media screen and (max-width: 1075px) {
virker menuen igen.

Nu ved jeg ikke om du bruger Mac eller PC; jeg kører på Mac. Hvad hedder
dit program? - eller er det nogen der kender et godt/billigt program til
Mac?

Post by Jan Hansen
Bortset fra det, så skal du nok selv tegne sådan en burger, eller finde
en gratis på nettet. Det FontAwesome, du linker til på linie 8, er ikke
noget, det er tilladt at bruge, uden der skal stå "Af hjertet tak..."
over hele skærmen.

Øhhh, hvor har du det fra?

Det har hele tiden irriteret mig at der trækkes på FontAwsome. Dels
risikerer jeg jo at den pludselig bliver utilgængelig og dels er det jo
umuligt at gennemskue hvad deres css består af.
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css.

Det er dét eksemplet på W3Schooles bruger og de ved vel hvad de gør?

Post by Jan Hansen
Burgeren kan hentes alene på
https://fontawesome.com/icons/bars?style=solid
Vejlednigen til at tegne en mage til selv er her,
https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths

Jow, men hvordan bruger man så dette ikon? Det hele er jo fedtet ind i
deres uoverskuelige css-fil.

[Jan Hansen]

Post by Kurt Hansen
Nu ved jeg ikke om du bruger Mac eller PC; jeg kører på Mac. Hvad hedder
dit program? - eller er det nogen der kender et godt/billigt program til
Mac?

Det hedder Kate, men det passer nok ikke til din unix-version,
https://kate-editor.org/
Nu har jeg hverken Rolls Royce eller Apple produkter, så jeg ved ikke,
hvilke programmer man kan få til sådan en. Men det skulle da undre mig,
om ikke der findes et eller andet, der kan lave almindelig syntax highlightning
af css.

Post by Kurt Hansen

Post by Jan Hansen
Bortset fra det, så skal du nok selv tegne sådan en burger, eller finde
en gratis på nettet. Det FontAwesome, du linker til på linie 8, er ikke
noget, det er tilladt at bruge, uden der skal stå "Af hjertet tak..."
over hele skærmen.

Øhhh, hvor har du det fra?

På https://fontawesome.com/v4.7.0/license/ står
"Applies to all CSS and LESS files...
URL: http://opensource.org/licenses/mit-license.html"
I den mit-licens står:

"The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software."

Post by Kurt Hansen
Det har hele tiden irriteret mig at der trækkes på FontAwsome. Dels
risikerer jeg jo at den pludselig bliver utilgængelig og dels er det jo
umuligt at gennemskue hvad deres css består af.
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css.

Det er ikke så slemt, den findes også upakket, så det er til at læse:
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css

Post by Kurt Hansen
Det er dét eksemplet på W3Schooles bruger og de ved vel hvad de gør?

Mon de har sådan en betalings-licens?

Post by Kurt Hansen
Jow, men hvordan bruger man så dette ikon? Det hele er jo fedtet ind i
deres uoverskuelige css-fil.

Det er bare at indsætte det i stedet for tegnet fra Det FontAwesome. kan du nøjes
med at der står "menu" er her en FontAwesome-fri version af siden:
http://www.sniper-pistol.com/responsiv.html
Hvis det absolut skal være et ikon (billede), kan der for eksempel stå sådan
http://www.sniper-pistol.com/responsiv2.html

Lav selv en ny gif eller svg eller hvad du nu synes er passende.

[Dennis Munding]

Post by Jan Hansen

Post by Kurt Hansen
Nu ved jeg ikke om du bruger Mac eller PC; jeg kører på Mac. Hvad
hedder dit program? - eller er det nogen der kender et godt/billigt
program til Mac?

Det hedder Kate, men det passer nok ikke til din unix-version,
https://kate-editor.org/
Nu har jeg hverken Rolls Royce eller Apple produkter, så jeg ved
ikke, hvilke programmer man kan få til sådan en. Men det skulle da
undre mig, om ikke der findes et eller andet, der kan lave almindelig
syntax highlightning af css.

Post by Kurt Hansen

Post by Jan Hansen
Bortset fra det, så skal du nok selv tegne sådan en burger, eller
finde en gratis på nettet. Det FontAwesome, du linker til på
linie 8, er ikke noget, det er tilladt at bruge, uden der skal
stå "Af hjertet tak..." over hele skærmen.

Øhhh, hvor har du det fra?

På https://fontawesome.com/v4.7.0/license/ står
"Applies to all CSS and LESS files...
url: http://opensource.org/licenses/mit-license.html"
"The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software."

Post by Kurt Hansen
Det har hele tiden irriteret mig at der trækkes på FontAwsome. Dels
risikerer jeg jo at den pludselig bliver utilgængelig og dels er
det jo umuligt at gennemskue hvad deres css består af.

https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css.
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css

Post by Jan Hansen

Post by Kurt Hansen
Det er dét eksemplet på W3Schooles bruger og de ved vel hvad de gør?

Mon de har sådan en betalings-licens?

Post by Kurt Hansen
Jow, men hvordan bruger man så dette ikon? Det hele er jo fedtet
ind i deres uoverskuelige css-fil.

Det er bare at indsætte det i stedet for tegnet fra Det FontAwesome.
kan du nøjes med at der står "menu" er her en FontAwesome-fri version
af siden: http://www.sniper-pistol.com/responsiv.html
Hvis det absolut skal være et ikon (billede), kan der for eksempel
stå sådan http://www.sniper-pistol.com/responsiv2.html
Lav selv en ny gif eller svg eller hvad du nu synes er passende.

Man behøver ikke lave en "burger" i SVG - den kan fint laves med css:

#nav-icon {
width:50px;
height:40px;
display:none;
}
#nav-icon span {
display:block;
position:absolute;
height:8px;
width:100%;
background:#efefef;
border-radius:8px;
opacity:1;
left:0;
transform:rotate(0deg);
transition:.25s ease-in-out;
}
#nav-icon span:nth-child(1) {top:0px;}
#nav-icon span:nth-child(2) {top:16px;}
#nav-icon span:nth-child(3) {top:32px;}
#nav-icon.open span:nth-child(1) {
top:16px;
transform:rotate(135deg);
}
#nav-icon.open span:nth-child(2) {
opacity:0;
left:-50px;
}
#nav-icon.open span:nth-child(3) {
top:16px;
transform:rotate(-135deg);
}


HTML:
<div id="nav-icon">
<span></span>
<span></span>
<span></span>
</div>


For animeret effekt bruges lidt javascript (jQuery):
$('#nav-icon').click(function(){
$(this).toggleClass('open');
$('nav').fadeToggle(1000);
});

Du skal naturligvis justere dimensioner og placering (margin) ud fra
din egen side/behov.

Jeg har mindsket bredde og højde på "burgerens" elementer til mindre
skærme, så den ikke ser for voldsom ud.

Du kan se den i aktion her: https://smu.dm-web.dk/

[Kim Ludvigsen]

Det er ikke nødvendigt, man kan bruge transform og transition i CSS.
Jeg bruger den her:
https://codepen.io/erikterwan/pen/EVzeRP

[Kurt Hansen]

Det er ikke nødvendigt, man kan bruge  transform og transition i CSS.
https://codepen.io/erikterwan/pen/EVzeRP

Begge forslag er helt sikkert brugbare, men jeg synes måske nok at
CSS-definitionerne allerede fylder for meget og gør en standardside
uoverskuelig. Her formoder jeg at <style></style> i <head>, samt menuen
og javascriptet i <body> skal med på alle sider. "Alle sider" er jo
dybest set samme design som index.html, blot med forskelligt indhold.

Båndbredde er jeg ikke så nervøs for, men det gør det jo lidt besværligt
at lave nye "varianter", men endnu værre: at søge og erstatte i alle
dokumenter, hvis jeg laver ændringer hen ad vejen og det vil jeg helt
sikkert gøre hen ad vejen.

Jeg forstår ikke hvorfor der skal linkes til FontAwsomes css-fil. Så
vidt jeg kan se optræder et træk på denne fil kun eet sted:

<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>

Hvis jeg kigger i awsome css'en er .fa lige til højrebenet og hvis jeg
bruger en af de foreslåede løsninger til et alternativt ikon, kan jeg
vel helt undvære linket til FontAwsome og lægge alt ud i en (eller
flere) eksterne css-fil(er) hos mig selv?

[Kim Ludvigsen]

Post by Kurt Hansen

Det er ikke nødvendigt, man kan bruge  transform og transition i CSS.
https://codepen.io/erikterwan/pen/EVzeRP

Begge forslag er helt sikkert brugbare, men jeg synes måske nok at
CSS-definitionerne allerede fylder for meget og gør en standardside
uoverskuelig. Her formoder jeg at <style></style> i <head>, samt menuen
og javascriptet i <body> skal med på alle sider.

CSS-definitionerne skal placeres i en CSS-fil, der så indlæses på alle
sider. Det vil sige, du skal kun rette ét sted, hvis du ændrer noget.

Menu og andre faste elementer kan også placeres i eksterne filer, der så
inkluderes på hver side. Dette kræver, at du skal bruge et
serverside-sprog som fx PHP. Alle dine filer vil så have filtypen php i
stedet for html, altså index.php i stedet for index.html.

Du behøver ikke at have filtypen med i URL'en, den kan laves, så URL'en
fx er (indsat mellemrum pga Google):
https://danarecords. com/elisabeth-klein-new-nordic-piano-music

Du skal ikke lade dig forvirre af php - du kan lave dit design helt som
ønsket i en html-fil. Når designet er på plads, kan de enkelte elementer
pilles ud og placeres i php-filer.

Hvis det var mig, der skulle lave en ny udgave af siden, så ville jeg
gøre nedenstående. Tro mig, investeringen af tid vil meget hurtigt blive
tjent ind igen - trods indledende ekstraarbejde med database:

* Tage papir og blyant og lave et layout på papir med alle de
forskellige sider, der skal være, fx:
** Forside
** Oversigtsside med en kunstner, genre, eller andet med en beskrivelse
af kunstneren/genren/... samt en efterfølgende liste over alle
kunstnerens/genrens/... plader.
** Beskrivelse af den enkelte plade.
** Om forretningen-side
osv.

Hvis der skal være forskel på layoutet på mobil og computer, så skal der
tegnes sider for begge dele (på de fleste af mine hjemmesider har jeg fx
en ekstra spalte eller to på store skærme).

* Lave html-sider med layout i henhold til tegningerne.

* Få kopieret databasen fra netbutikken ind i en ny database, hvor du så
kan tilføje flere felter. Jeg ved ikke, hvilke felter der er i den
eksisterende database, men jeg kan forestille mig, at følgende bør være
i den nye:
** id
** Kunstner
** Medvirkende kunstnere/dirigenter/solister
** Titel
** Pladeselskab
** Pladenummer
** Udgivelsesår
** Pris
** URL (den nye med kunstner-titel)
** Genre
** Pladetype (solo, opsamling, orkester osv.)
** På lager

* Lave en redigeringsside til at indsætte nye plader i databasen - den
kan så også bruges til at indtastede oplysninger, som ikke findes i den
gamle database, fx den nye url.

* Lave scripts til at hente data fra databasen og indsætte det på de
forskellige sider.

Når ovenstående er lavet, er siden færdig. Du vil kunne få hjælp til det
meste herinde, men hvis din tid ikke er gratis, ville det måske være
bedre at finde en 15-årig, der kan lave det.

Den færdige hjemmeside vil være dynamisk, forstået på den måde, at når
du indtaster en ny plade, vil den straks være at finde på siden med
oversigt over kunstnerens andre plader, på genre-siden, på en side med
udgivelser et bestemt år, og hvad du ellers kan finde på at lave. Du
skal ikke mere sidde og nørkle med at lave specielle html-sider i
hånden. Du vil også have en stærk søgefunktion, der kan hjælpe kunderne
med at finde de plader, de leder efter.

[Kurt Hansen]

Post by Kim Ludvigsen

Post by Kurt Hansen
Begge forslag er helt sikkert brugbare, men jeg synes måske nok at
CSS-definitionerne allerede fylder for meget og gør en standardside
uoverskuelig. Her formoder jeg at <style></style> i <head>, samt
menuen og javascriptet i <body> skal med på alle sider.

Du vil kunne få hjælp til det
meste herinde, men hvis din tid ikke er gratis, ville det måske være
bedre at finde en 15-årig, der kan lave det.

Min tid ER gratis og jeg er meget taknemmelig for den hjælp jeg har fået
so far, men sammen af min uvidenhed står efterhånden lysende klart.

Jeg går lige i tænkeboks, men overvejer kraftigt at give op :-(

[Kurt Hansen]

Post by Kurt Hansen
so far, men sammen af min uvidenhed står efterhånden lysende klart.

Sammen > summen ;-)

[Henning]

Post by Kurt Hansen
Min tid ER gratis og jeg er meget taknemmelig for den hjælp jeg har fået
so far, men sammen af min uvidenhed står efterhånden lysende klart.
Jeg går lige i tænkeboks, men overvejer kraftigt at give op :-(

På den anden side: Hvis man ikke forsøger sig med moget nyt, bliver man
heller ikke klogere.

[Kurt Hansen]

Post by Kurt Hansen

Post by Kurt Hansen
Begge forslag er helt sikkert brugbare, men jeg synes måske nok at
CSS-definitionerne allerede fylder for meget og gør en standardside
uoverskuelig. Her formoder jeg at <style></style> i <head>, samt
menuen og javascriptet i <body> skal med på alle sider.

Du vil kunne få hjælp til det meste herinde, men hvis din tid ikke er
gratis, ville det måske være bedre at finde en 15-årig, der kan lave det.

Min tid ER gratis og jeg er meget taknemmelig for den hjælp jeg har fået
so far, men summen af min uvidenhed står efterhånden lysende klart.
Jeg går lige i tænkeboks, men overvejer kraftigt at give op :-(

Undskyld mit negative udfald i går. Det var fremkaldt af at jeg synes
jeg stiller for mange "dumme" spørgsmål om helt grundlæggende ting, som
jeg selv kunne/burde gøre en indsats for at samle op på og jeg har da
også flere gange skrevet, at links til relevant læsestof er velkomne som
erstatning for, eller tillæg til, detaljeret hjælp.

[Kim Ludvigsen]

Post by Kurt Hansen

Post by Kurt Hansen

Du vil kunne få hjælp til det meste herinde, men hvis din tid ikke er
gratis, ville det måske være bedre at finde en 15-årig, der kan lave det.

Min tid ER gratis og jeg er meget taknemmelig for den hjælp jeg har
fået so far, men summen af min uvidenhed står efterhånden lysende klart.
Jeg går lige i tænkeboks, men overvejer kraftigt at give op :-(

Undskyld mit negative udfald i går.

Det er ikke noget problem. Det med den 15-årige var bestemt ikke ment
nedsættende.

Hvis du skal sætte dig ind i det hele, kan det tage en del tid at gøre
det, som jeg foreslår. En 15-årig, der kender CSS, PHP og databaser på
forhånd, kan gøre det på forholdsvis kort tid, og skal måske ikke have
en alt for voldsom betaling for at lave det.

Selv hvis du selv skal lave det, vil jeg vurdere, at tiden er givet godt
ud, fordi du sparer en masse tid på langt sigt, og du får mange
muligheder med hjemmesiden, som du ikke har nu.

[Henning]

Post by Kim Ludvigsen
Menu og andre faste elementer kan også placeres i eksterne filer, der så
inkluderes på hver side. Dette kræver, at du skal bruge et
serverside-sprog som fx PHP. Alle dine filer vil så have filtypen php i
stedet for html, altså index.php i stedet for index.html.

Der findes også et script til at includere indhold fra klienten.

https://www.w3schools.com/howto/howto_html_include.asp

Har selv brugt det en del på en semi-statisc side. Virker fint. Jeg
havde menuen og noget footer som lå eksternt fra data-siderne.

Dvs du kan placere menuen i en separat html-fil som du henter ind på
alle dine sider.

Det samme kan du gøre med din footer, og anden statisk tekst som er på
alle dine sider.

/Henning

[Jan Hansen]

Post by Kurt Hansen
Jeg forstår ikke hvorfor der skal linkes til FontAwsomes css-fil. Så
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
Hvis jeg kigger i awsome css'en er .fa lige til højrebenet og hvis jeg
bruger en af de foreslåede løsninger til et alternativt ikon, kan jeg
vel helt undvære linket til FontAwsome og lægge alt ud i en (eller
flere) eksterne css-fil(er) hos mig selv?

Lige præcis. Tilføj

.fa {
display: inline-block;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.fa-bars:before {
content: "menu";
}

i dit eget css, og gem hele css afdelingen som en fil.

[Kurt Hansen]

Post by Jan Hansen

Post by Kurt Hansen
Jeg forstår ikke hvorfor der skal linkes til FontAwsomes css-fil. Så
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
Hvis jeg kigger i awsome css'en er .fa lige til højrebenet og hvis jeg
bruger en af de foreslåede løsninger til et alternativt ikon, kan jeg
vel helt undvære linket til FontAwsome og lægge alt ud i en (eller
flere) eksterne css-fil(er) hos mig selv?

Lige præcis. Tilføj
.fa {
display: inline-block;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.fa-bars:before {
content: "menu";
}
i dit eget css, og gem hele css afdelingen som en fil.

Ok, men hvad henviser "menu" til i fa-bars?

[Kurt Hansen]

Post by Kurt Hansen

Post by Jan Hansen

Post by Kurt Hansen
Jeg forstår ikke hvorfor der skal linkes til FontAwsomes css-fil. Så
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
     <i class="fa fa-bars"></i>
</a>
Hvis jeg kigger i awsome css'en er .fa lige til højrebenet og hvis jeg
bruger en af de foreslåede løsninger til et alternativt ikon, kan jeg
vel helt undvære linket til FontAwsome og lægge alt ud i en (eller
flere) eksterne css-fil(er) hos mig selv?

Lige præcis. Tilføj
.fa {
   display: inline-block;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}
.fa-bars:before {
   content: "menu";
}
i dit eget css, og gem hele css afdelingen som en fil.

Ok, men hvad henviser "menu" til i fa-bars?

Aha, det fandt jeg så ud af nu. I stedet for brændestakken/burgeren,
skriver dem bare "menu" :-(

[Kurt Hansen]

Post by Jan Hansen
Burgeren kan hentes alene på
https://fontawesome.com/icons/bars?style=solid

Så vidt jeg kan se, kan den kun downloades som solid og i svg-format.

På http://www.sniper-pistol.com/responsiv2.html bruger du en .gif og når
jeg afvikler http://www.danacord.com/sniper/index.html i Firefox, så
vises ikonet ikke. Ved mouseover vises der dog kun en grå firkant og når
jeg klikke på den, så kommer menuen som forventet.

Jeg har denne kode i css-filen:
.fa-bars:before {
content: url("http://danacord.com/sniper/images/bars-solid.svg");
}

Jeg har prøvet at konvertere svg'en til gif, men det gør ingen forskel.

[Kurt Hansen]

Post by Jan Hansen
.fa-bars:before {
   content: url("http://danacord.com/sniper/images/bars-solid.svg");
}

Jeg har fjernet gåseøjnene, som åbenbart ikke skal være der, men det
ændrer ikke noget.

Jeg har også ændret til .gif og har sågar ændret størrelsen til 50*57px,
da konverteringen fra .svg (600*686px) bliver kæmpe stor, men det duer
heller ikke.

Jeg fatter så lidt som ingenting :-(

[Jan Hansen]

Post by Jan Hansen
.fa-bars:before {
content: url("http://danacord.com/sniper/images/bars-solid.svg");
}
Jeg har prøvet at konvertere svg'en til gif, men det gør ingen forskel.

Lige i øjeblikket virker det da på http://www.danacord.com/sniper/index.html
den er bare meget stor, men menuen kommer da frem, når man klikker på den.

Kan du nøjes med en sammelfaldet brændestak, så prøv at genindlæse
http://www.sniper-pistol.com/responsiv2.html

[o***@gmail.com]

Du kan hente koden til klap-sammen-menu her: alhagrafisk.dk
Mvh
Hans

[Jan Hansen]

Post by o***@gmail.com
Du kan hente koden til klap-sammen-menu her: alhagrafisk.dk

Smart, jeg vidste ikke, at der var en burger med i den ubuntu
font. Jeg ved ikke lige, hvorfor der absolut skal stå Arial,
men nu har jeg tegnet en burger svg-burger, der kan sættes ind
i css, http://www.sniper-pistol.com/responsiv.html

[Kurt Hansen]

Post by Jan Hansen

Post by Jan Hansen
.fa-bars:before {
content: url("http://danacord.com/sniper/images/bars-solid.svg");
}
Jeg har prøvet at konvertere svg'en til gif, men det gør ingen forskel.

Lige i øjeblikket virker det da på http://www.danacord.com/sniper/index.html
den er bare meget stor, men menuen kommer da frem, når man klikker på den.
Kan du nøjes med en sammelfaldet brændestak, så prøv at genindlæse
http://www.sniper-pistol.com/responsiv2.html

Jæuw, Jan, men hvor ligger ikonet og hvilket format er det? Definitionen
af .fa-bars er helt uigennemskuelig for mig.