Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
Ian
@toianw
@hannahcologne you'll need two script tags - one for the jquery and one for your own code. Or you could put your code in the JS pane on codepen rather than the html. You can also include jquery through the settings -> javascript in codepen. That way, you don't need any script tags in the html pane.
Ronald Ceballos
@Ronald03
@hannahcologne your button is inside the .quotebox, so when you get the quote to shows, it will replace everything under your .quotebox div
I made the following changes to your code:
$(document).ready(function() {
$("#changeQuote").on("click", function(){
$("#test").html("NAme");
});
});
Daniel Romero
@Ranacode
I find two things @hanna
Ronald Ceballos
@Ronald03
I added the id="test" to the <p> inside your .quotebox
Daniel Romero
@Ranacode
@hannahcologne First of all, you was writing jQuery code inside the script that already implement the jQuery library so that's not gonna work. Just removed it and put the code you had on the JS tab on the right side.
Ronald Ceballos
@Ronald03
image.png
@hannahcologne take a look at that screenshot
Daniel Romero
@Ranacode
Second thing, You was writing the quote inside the '.quotebox' but it was taking of all your html tags, so you can add this
$(document).ready(function() {
    $("#changeQuote").on("click", function(){
      $(".quotebox p").text("Here is the message");
    });
  });
Ops sorry @ronald you already answer this :P
Ronald Ceballos
@Ronald03
haha @Ranacode cool!
Hannahcologne
@hannahcologne
haha wow so many answers :-) Thanks @Ronald03, @Ranacode and @toianw!!
CamperBot
@camperbot
hannahcologne sends brownie points to @ronald03 and @ranacode and @toianw :sparkles: :thumbsup: :sparkles:
api offline
:cookie: 504 | @toianw |http://www.freecodecamp.org/toianw
:cookie: 318 | @ronald03 |http://www.freecodecamp.org/ronald03
Matej Bošnjak
@mbosnjak01
@hannahcologne also .. classes like container-fluid, btn btn primary, col-xs-12 ... those are Bootstrap classes, so if you want them to have influence in your design, you should also include bootstrap library css file (link tag inside your head tag), and bootstrap js file on the bottom, under jquery library
Ivan Ngundela
@ingundela
hello everyone, I’m testing my portfolio website and need some help from you mates… the website is https://www.ingundela.com/ … what is bodering my the loading time of the hero image.. I’ve optimazed all the image make the loading time shorter but when you load the website for the first time the hero image takes to long to load…what should be the way forward to fix it? Thank you in advance
Kevin Kindorf
@kkindorf
@ingundela one thing you could do is that if the image is taking a while to load, you could set a background color to the div it'll be applied to. that way there won't be any out of place white space but instead there could be a darker gray background for your top div and then the image would loaded on top of that once it's fully loaded. Besides I don't see any issues when I go to your site everything loads quickly
DuskyPixel
@DuskyPixel
@ingundela https://www.sitepoint.com/five-techniques-lazy-load-images-website-performance/ maybe? I have not personally tried lazy loading but it might help?
Ivan Ngundela
@ingundela
@kkindorf @DuskyPixel Thank you guys I’ll have a look
CamperBot
@camperbot
ingundela sends brownie points to @kkindorf and @duskypixel :sparkles: :thumbsup: :sparkles:
:cookie: 147 | @duskypixel |http://www.freecodecamp.org/duskypixel
:cookie: 347 | @kkindorf |http://www.freecodecamp.org/kkindorf
Ivan Ngundela
@ingundela
@kkindorf is there anything else I should do before a load my webite to the server? like optimazing my code or something like it?…for the image I use photoshop and then imageOptim..
Kevin Kindorf
@kkindorf
@ingundela does it not load for you? because everytime I open your website I don't notice any problems
Ivan Ngundela
@ingundela
@kkindorf it does load for me, but still see a grey color for a few second before the actuall image load…
Kevin Kindorf
@kkindorf
@ingundela there are other web based tools out there that can optimize images but I dont remember the names for them. You'll have to google around to see what other solutions people have come up with if you think it's going to be a significant design issue for your site I found this if it helps https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/image-optimization
John
@flyboy1565

so i have this codepen that is just a copy of a bootstrap template for collapse-nav.
https://codepen.io/flyboy1565/full/ENJNjZ/
what i want to do is, based on the break points (xs, sm, md) i want to hide the navbar-nav items.

example would be
lg change to md hide page 3 link
md to sm hide page 3 and page 2 links..

can anyone help me?

Ronald Ceballos
@Ronald03
You want to hide a link at the time, depending the size of the screen, is that what you are looking for? @flyboy1565
if that's what you are looking for, where do you want the first link to hide to?
John
@flyboy1565
@Ronald03 I want it to go into the hamburger button
Adam Bohannon
@abohannon
If I have a really long SVG code in my CSS for a background that's crowding my file... is it acceptable to import it from another file in order to clean up my main styles.css? Just curious.
Dee
@xirokx
@bjorno43 thanks mate
CamperBot
@camperbot
xirokx sends brownie points to @bjorno43 :sparkles: :thumbsup: :sparkles:
:cookie: 179 | @bjorno43 |http://www.freecodecamp.org/bjorno43
ehutchllew
@ehutchllew
@abohannon I don't see why not.
Yossi Fisch
@yoizfefisch
I am trying to create a fluid iframe and followed a method that I found all over the web, you can see it here. However, the wrapper element in my case is a Flex item and that causes issues on Edge. Can anyone suggest a solution? https://codepen.io/yoizfefisch/pen/wpPLXE
Neil
@NNeil1
Can someone explain how I add a background color to a navigation bar when I have a logo placed in there within a div? I can change background color without the image, but as soon as I position my logo on the far left, I can't change any background color
Tiago Correia
@tiagocorreiaalmeida
are you using floats?
Neil
@NNeil1
Yes I am
Tiago Correia
@tiagocorreiaalmeida
add overflow hidden
to the div
floats have alot of issues:D
Neil
@NNeil1
Ah, thanks! What exactly does Overflow do? @tiagocorreiaalmeida
CamperBot
@camperbot
:cookie: 489 | @tiagocorreiaalmeida |http://www.freecodecamp.org/tiagocorreiaalmeida
nneil1 sends brownie points to @tiagocorreiaalmeida :sparkles: :thumbsup: :sparkles:
Eric Weiss
@eweiss17
If the component extends outside of the div, overflow hidden will hide it