/ / Showdown Markdown Editor: Wie kann ich die Größe der Bilder ändern, um sie dem Inhalt anzupassen? - Javascript, anglejs, markdown, pagedown, showdown

Showdown Markdown Editor: Wie skaliert man Bilder, um sie in den Inhalt zu integrieren? - javascript, angularjs, Abschriften, pagedown, showdown

Ich versuche es zu benutzen Stapel überfließt Markdown-Editor Showdown von seinem Angularjs-Modul ng-showdown

Alles läuft gut, aber das aufgenommene Bild hat die tatsächliche / ursprüngliche Größe.

Wie kann ich die Größe ändern, damit sie in den Text passt?

Nachfolgend ist ein Dummy angegeben, der das gleiche Problem aufweist.

Danke vielmals!!!

<html ng-app="theShowdown">

<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular-route.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular-animate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap-tpls.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.3.0/showdown.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular-sanitize.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-showdown/1.1.0/ng-showdown.min.js"></script>
<script>
var theShowdown = angular.module("theShowdown", ["ngRoute", "ngSanitize", "ngAnimate", "ui.bootstrap", "ng-showdown"]);

theShowdown.config(function() {

})

theShowdown.controller("theMain", function($scope, $showdown) {

$scope.mymarkdown = `**Hello** _Stackover Flow_ ![Showdown][sd-logo]

[sd-logo]: http://logz.io/wp-content/uploads/2016/02/stack-overflow-logo.png`;

var htmlValue = $showdown.makeHtml($scope.mymarkdown)

})
</script>
</head>

<body ng-controller="theMain">
<p markdown-to-html="mymarkdown"></p>
<textarea rows="4" cols="150" ng-model="mymarkdown"></textarea>
</body>

</html>

Antworten:

2 für die Antwort № 1

Haftungsausschluss:

Ich bin der aktuelle Projektleiter des Showdowns.


Nach showdowns Dokumentation:

parseImgDimensions: (boolean) [default false] Unterstützung für das Festlegen von Bildabmessungen in der Markdown-Syntax aktivieren. Beispiele:

![foo](foo.jpg =100x80)     simple, assumes units are in px
![bar](bar.jpg =100x*)      sets the height to "auto"
![baz](baz.jpg =80%x5em)  Image with width of 80% and height of 5em

Sie müssen also die Option aktivieren parseImgDimensions und dann die obige Syntax verwenden.

Beispiel

Übergabe von Optionen im Konstruktor:

var converter = new showdown.Converter({parseImgDimensions: true});

oder

var converter = new showdown.Converter();
converter.setOption("parseImgDimensions", true);

1 für die Antwort № 2

Endlich einen Weg gefunden

bei der Angabe der URL für den Link hinzufügen abc.png =100x* Dadurch wird die Höhe auf 100 gesetzt und die Breite wird automatisch berechnet.


Verwandte Fragen


Kommentare (0)

Einen Kommentar hinzufügen