Posts Tagged with origin

Displaying 1-2 of 2 results.
Resolved: Access to Font at from origin has been blocked by CORS policy
posted by admin on August 4, 2017
I have two websites - two different domains.
In style css I have font-face and include fonts from the same domain

@font-face {
font-family: "wr-icons";
font-style: normal;
font-weight: 400;
src:
url("../font/cbh-icons.eot") format("embedded-opentype"),
url("../font/cbh-icons.woff") format("woff"),
url("../font/cbh-icons.ttf") format("truetype"),
url("../font/cbh-icons.svg") format("svg");
}

It is working perfect on fonts owner domain, But when I trying to include from these fonts from the seconds domain, I got an errors like

Access to Font at 'https://isystems.am/font/cbh-icons.ttf' from origin 'http://lifestyle.am' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://lifestyle.am' is therefore not allowed access.

Server Side is Ubuntu 16.04 with NginXRead more
Wiki: Css3 spin icon with originwiki
posted by admin on November 7, 2016
HTML:

<h1 class="text-center">
<span class="glyphicon glyphicon-refresh spin"></span>
<span class="glyphicon glyphicon-record spin"></span>
<span class="glyphicon glyphicon-send spin"></span>
<span class="glyphicon glyphicon-star spin"></span>
</h1>

<h3 class="text-center">
<span class="glyphicon glyphicon-refresh spin"></span>
<span class="glyphicon glyphicon-record spin"></span>
<span class="glyphicon glyphicon-send spin"></span>
<span class="glyphicon glyphicon-star spin"></span>
</h3>

<h6 class="text-center">
<span class="glyphicon glyphicon-refresh spin"></span>
<span class="glyphicon glyphicon-record spin"></span>
<span class="glyphicon glyphicon-send spin"></span>
<span class="glyphicon glyphicon-star spin"></span>
</h6>

CSS3:

.spin {
-webkit-animation: spin .2s infinite linear;
-moz-animation: spin .2s infinite linear;
-o-animation: spin .2s infinite linear;
animation: spin .2s infinite linear;
-webkit-transform-origin: 50% 58%;
transform-origin:50% 58%;
-ms-transform-origin:50% 58%; /* IE 9 */
}

@-moz-keyframes spin {
from {
-moz-transform: rotate(0deg);
}
to {
-moz-transform: rotate(360deg);
}
}

@-webkit-keyframes spin {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}

@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
Read more