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
John
@flyboy1565
@khaduch , thanks for the follow-up. I'm using v3.. I have a normal navbar setup.. but I want to create a hamburger button when the screen goes to a MD and hide 1 elements in that. And so on till we're down to xs
CamperBot
@camperbot
flyboy1565 sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3661 | @khaduch |http://www.freecodecamp.org/khaduch
Hannahcologne
@hannahcologne
Hi guys! Does anyone have time to take a look at this code for the Random Quote Machine? I can't really figure out why the text does not change when the button is clicked :worried: Thank you!! https://codepen.io/hannahcologne/pen/jYazNp
Ronald Ceballos
@Ronald03
@hannahcologne lets ee
see
Matej Bošnjak
@mbosnjak01
@hannahcologne where did you include jquery library inside your code?
cause i don't see it :)
Daniel Romero
@Ranacode
Yes, you don't have the jquery library
and if you check the developers console tells you: "$ is not defined"
Matej Bošnjak
@mbosnjak01
just include jquery lib and it should work, otherwise write your code in plain js
Hannahcologne
@hannahcologne

Oops.. I had it before, like this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
$(document).ready(function() {
$("#changeQuote").on("click", function(){
$(".quotebox").html("Here is the message");
});
});
</script>

but then it still didn't work. Did I include the wrong link?

Matej Bošnjak
@mbosnjak01
@hannahcologne try <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
Ken Haduch
@khaduch
@flyboy1565 - if you follow the setup information on the navbar docs, that is what you'll end up with, exactly what you're looking for. If you already started using something, then make a test CodePen and copy the code and set it up to see it work. Then use as you need it.
Hannahcologne
@hannahcologne
thanks @mbosnjak01 and @Ranacode for taking a look!!
CamperBot
@camperbot
hannahcologne sends brownie points to @mbosnjak01 and @ranacode :sparkles: :thumbsup: :sparkles:
:cookie: 358 | @ranacode |http://www.freecodecamp.org/ranacode
:cookie: 215 | @mbosnjak01 |http://www.freecodecamp.org/mbosnjak01
Daniel Romero
@Ranacode
I'll recommend you @hannahcolognee put the <script> tags just before the </body>. That's because it's a good practice wait to render the html first in order to access the DOM elements via javascript without problems
Hannahcologne
@hannahcologne
@mbosnjak01 I have included that link now (https://codepen.io/hannahcologne/pen/jYazNp but it doesn't work for me yet
thanks @Ranacode will try that!
CamperBot
@camperbot
hannahcologne sends brownie points to @ranacode :sparkles: :thumbsup: :sparkles:
api offline
Daniel Romero
@Ranacode
By the way, you can go to settings and configure your project, adding the preprocessors, scripts, etc..
CamperBot
@camperbot
hannahcologne sends brownie points to @ranacode :sparkles: :thumbsup: :sparkles:
Hannahcologne
@hannahcologne
thank you @Ranacode! will take a look there. Unfortunately my code still doesn't work, even with the JQuery library included :(
CamperBot
@camperbot
api offline
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: