Can anyone assist with the following Jekyll error?
H:\jekyll\styleguide>jekyll build
Configuration file: H:/jekyll/styleguide/_config.yml
Source: H:/jekyll/styleguide
Destination: H:/jekyll/styleguide/_site
Generating... enter code here
Error reading file H:/jekyll/styleguide/_android/1_lorem-ipsum.md: undefined met
hod `fetch' for "output:true":String
Liquid Exception: undefined method `fetch' for "output:true":String in _layout
s/default.html
jekyll 2.4.0 | Error: undefined method `fetch' for "output:true":String
Code of 1_lorem_ipsum.md attached below:
---
layout: default
title: Lorem Ipsum
---
Lorem Ipsum
==========
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Fixed. There was a missing space in the config.yml file :)
Related
Here is my code:
<marquee width="100%" direction="left" height="15vh">
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</marquee>
When I insert the code to the HTML widget on the elementor page builder. There is a delay until the widget shows the text. Here on stack overflow the text runs fine. But on elementor the text is stack and didn't run immediately.
There is no animation or something else that I defined to do delay.
As I understand, this tag is deprecated in the new version of HTML.
So, can someone suggest how to create text like the code above?
I am trying to extract the link text of multiple <a> tags within the_content(); of Wordpress posts, so I can use them as the class for each <a>. I have successfully extracted the link text and used addClass to classify them so we can clean up our outbound link reporting.
The problem is that it is putting each <a> link text as a long class for all <a>.
var linkText = $('.entry-content a').text();
$('.entry-content a').addClass(linkText);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="entry-content">
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</div>
This code shows up in inspector shown below
Pass a callback function to .addClass() instead like:
$('.entry-content a').addClass(function() {
return $(this).text();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="entry-content">
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</div>
I created a ASP.Net Core Web Application with Angular in VS2017.
The initial application word wraps the way I want.
However after I added some HTML and styles the word wrap no longer works when the left panel is showing.
I found that the following HTML
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
<div class="container">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
</div>
causes the following display
How do I fix the effect of the Div?
Try adding this css for wordwrap
h2 {
white-space: normal;}
Instead of using
<div class="container">
I needed to use
<div class="container-fluid">
I'm wondering whether this is just the way that browsers act or whether it's a CSS property that I can change.
Take this simple example I made: https://jsfiddle.net/ogLw3ptj/
HTML:
<div class="box-with-scroll">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
CSS:
.box-with-scroll
{
overflow-y: scroll;
width: 200px;
height: 500px;
border: 1px dashed black;
padding: 15px;
}
Repro steps:
(1) Center the scrollbar vertically
(2) Click and hold down the scrollbar
(3) Move mouse directly out to the right
(4) Scrollbar "jumps" to top
I'd like to show a pic, but PrtScn doesn't show mouse pointers :(
Happens in all browsers I've tried in
This is the default behaviour, it repositions the scrollbar to the original location when you move the cursor out of position(there seems to be a rectangle around the scrollbar)
Related info:
Source 1 UX Stackexchange
Source 2 Bug Report Chromium
This is My Html Code For Back To Top.
<html>
<head>
<title>Back To Top</title>
</head>
<body id='backtotop'>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<a href="#backtotop" id='moveback' style='display:none;'>Backtotop</a>
<button id='Clickme'>Click</button>
<script type="text/javascript">
jQuery(function($) {
$(document).ready(function(){
$("#Clickme").click(function(){
$("#moveback").click();
$("#moveback").trigger('click');
});
});
}(jQuery));
</script>
</body>
</html>
When i click on Backtotop link is working find on desktop. but when i try to tablet or mobile this is not working. when i click on link it dosen't move back to top on tablet or mobile.
please help.
Thank you.
Generally it is called internal linking Where hyper link is within same web page.
The code we mostly use is
<A NAME="LINK"> </A>
Where LINK is the name of that position.
Example:
<body>
<H4>Click here to go to bottom bottom of the page </H4>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<A NAME="BOTTOM"><h1>This si bottom</h1></A>
</body>
And if this is not working then you can implement scroll function like :
function scrollWindow()
{
window.scrollTo(x,y);
}
// where
// x= for horizontal co-ordinates,y=for vertical cordinates
//x=100,y=600--try this
execute this function onclick of your link
<ul>
<li><a href="#backtotop" onclick=scrollwindow>Backtotop</a></li>
</ul>
And also you can use the ID attribute in place of the NAME attribute in the tag to name the section in a Web page.
Please NOTE: Many elements on page are floating elements. As a result, the browser cannot find a precise point to link to if the anchor target is not within a floated element. In other words, if the anchor tag is outside a floating element, and you have many floating elements on your page, internal links may not work properly. To fix this, place your anchor target within one of the floating elements.