Can possible transform translateXY mixin function in sass
1
Hello i am using mixin fuction for translateX and translateY and create only one function for both value X and Y that is possible or not please help Thanks in Adavance.
Example-1 is possible because only one value pass but another example is possilbe or not any other idea for pass two value at a time in only one function in SASS ?
Example-1
@mixin translateX($value) {
-webkit-transform: translateX($value);
-moz-transform: translateX($value);
-ms-transform: translateX($value);
transform: translateX($value);
}
Example-2
@mixin translateXY($value1, $value2) {
-webkit-transform: translateXY($value1, $value2);
-moz-transform: translateXY($value1, $value2);
-ms-transform: translateXY($value1, $value2);
transform: translateXY($value1, $value2);
}
css sass
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
add a comment |
1
Hello i am using mixin fuction for translateX and translateY and create only one function for both value X and Y that is possible or not please help Thanks in Adavance.
Example-1 is possible because only one value pass but another example is possilbe or not any other idea for pass two value at a time in only one function in SASS ?
Example-1
@mixin translateX($value) {
-webkit-transform: translateX($value);
-moz-transform: translateX($value);
-ms-transform: translateX($value);
transform: translateX($value);
}
Example-2
@mixin translateXY($value1, $value2) {
-webkit-transform: translateXY($value1, $value2);
-moz-transform: translateXY($value1, $value2);
-ms-transform: translateXY($value1, $value2);
transform: translateXY($value1, $value2);
}
css sass
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
Its possible !! mixin is like a function in any language, you can pass how much parameters you want, and you can set a start value for it like this@mixin translateXY($value1, $value2: 30)if you don't pass the second value it will assume 30 as default
– João Deroldo
Nov 13 '18 at 12:56
add a comment |
1
1
1
Hello i am using mixin fuction for translateX and translateY and create only one function for both value X and Y that is possible or not please help Thanks in Adavance.
Example-1 is possible because only one value pass but another example is possilbe or not any other idea for pass two value at a time in only one function in SASS ?
Example-1
@mixin translateX($value) {
-webkit-transform: translateX($value);
-moz-transform: translateX($value);
-ms-transform: translateX($value);
transform: translateX($value);
}
Example-2
@mixin translateXY($value1, $value2) {
-webkit-transform: translateXY($value1, $value2);
-moz-transform: translateXY($value1, $value2);
-ms-transform: translateXY($value1, $value2);
transform: translateXY($value1, $value2);
}
css sass
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
Hello i am using mixin fuction for translateX and translateY and create only one function for both value X and Y that is possible or not please help Thanks in Adavance.
Example-1 is possible because only one value pass but another example is possilbe or not any other idea for pass two value at a time in only one function in SASS ?
Example-1
@mixin translateX($value) {
-webkit-transform: translateX($value);
-moz-transform: translateX($value);
-ms-transform: translateX($value);
transform: translateX($value);
}
Example-2
@mixin translateXY($value1, $value2) {
-webkit-transform: translateXY($value1, $value2);
-moz-transform: translateXY($value1, $value2);
-ms-transform: translateXY($value1, $value2);
transform: translateXY($value1, $value2);
}
css sass
css sass
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
edited Nov 13 '18 at 12:59
Aaron McGuire
4328
4328
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
asked Nov 13 '18 at 12:49
Dharmesh VekariyaDharmesh Vekariya
5131421
5131421
Its possible !! mixin is like a function in any language, you can pass how much parameters you want, and you can set a start value for it like this@mixin translateXY($value1, $value2: 30)if you don't pass the second value it will assume 30 as default
– João Deroldo
Nov 13 '18 at 12:56
add a comment |
Its possible !! mixin is like a function in any language, you can pass how much parameters you want, and you can set a start value for it like this@mixin translateXY($value1, $value2: 30)if you don't pass the second value it will assume 30 as default
– João Deroldo
Nov 13 '18 at 12:56
Its possible !! mixin is like a function in any language, you can pass how much parameters you want, and you can set a start value for it like this
@mixin translateXY($value1, $value2: 30) if you don't pass the second value it will assume 30 as default– João Deroldo
Nov 13 '18 at 12:56
Its possible !! mixin is like a function in any language, you can pass how much parameters you want, and you can set a start value for it like this
@mixin translateXY($value1, $value2: 30) if you don't pass the second value it will assume 30 as default– João Deroldo
Nov 13 '18 at 12:56
add a comment |
1 Answer
1
active
oldest
votes
1
Use sass as below:
Set in @include the params of translate:@include translateXY(30%,50%);
And in @mixin use translate and not translateXY
See fiddle
@mixin translateXY($value1, $value2) {
.try{
-webkit-transform: translate($value1, $value2);
-moz-transform: translate($value1, $value2);
-ms-transform: translate($value1, $value2);
transform: translate($value1, $value2);
}
}
@include translateXY(30%,50%);
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
1
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
1
Yes .. if you want more classes add to@mixim
– לבני מלכה
Nov 13 '18 at 13:24
1
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
1
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
|
show 1 more comment
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53281385%2fcan-possible-transform-translatexy-mixin-function-in-sass%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
Use sass as below:
Set in @include the params of translate:@include translateXY(30%,50%);
And in @mixin use translate and not translateXY
See fiddle
@mixin translateXY($value1, $value2) {
.try{
-webkit-transform: translate($value1, $value2);
-moz-transform: translate($value1, $value2);
-ms-transform: translate($value1, $value2);
transform: translate($value1, $value2);
}
}
@include translateXY(30%,50%);
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
1
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
1
Yes .. if you want more classes add to@mixim
– לבני מלכה
Nov 13 '18 at 13:24
1
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
1
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
|
show 1 more comment
1
Use sass as below:
Set in @include the params of translate:@include translateXY(30%,50%);
And in @mixin use translate and not translateXY
See fiddle
@mixin translateXY($value1, $value2) {
.try{
-webkit-transform: translate($value1, $value2);
-moz-transform: translate($value1, $value2);
-ms-transform: translate($value1, $value2);
transform: translate($value1, $value2);
}
}
@include translateXY(30%,50%);
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
1
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
1
Yes .. if you want more classes add to@mixim
– לבני מלכה
Nov 13 '18 at 13:24
1
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
1
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
|
show 1 more comment
1
1
1
Use sass as below:
Set in @include the params of translate:@include translateXY(30%,50%);
And in @mixin use translate and not translateXY
See fiddle
@mixin translateXY($value1, $value2) {
.try{
-webkit-transform: translate($value1, $value2);
-moz-transform: translate($value1, $value2);
-ms-transform: translate($value1, $value2);
transform: translate($value1, $value2);
}
}
@include translateXY(30%,50%);
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
Use sass as below:
Set in @include the params of translate:@include translateXY(30%,50%);
And in @mixin use translate and not translateXY
See fiddle
@mixin translateXY($value1, $value2) {
.try{
-webkit-transform: translate($value1, $value2);
-moz-transform: translate($value1, $value2);
-ms-transform: translate($value1, $value2);
transform: translate($value1, $value2);
}
}
@include translateXY(30%,50%);
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
answered Nov 13 '18 at 13:02
לבני מלכהלבני מלכה
9,5791726
9,5791726
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
1
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
1
Yes .. if you want more classes add to@mixim
– לבני מלכה
Nov 13 '18 at 13:24
1
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
1
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
|
show 1 more comment
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
1
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
1
Yes .. if you want more classes add to@mixim
– לבני מלכה
Nov 13 '18 at 13:24
1
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
1
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
This is not possible
– Dharmesh Vekariya
Nov 13 '18 at 13:10
1
1
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
jsfiddle.net/8bzn3axo what not possible.. please explain
– לבני מלכה
Nov 13 '18 at 13:11
1
1
Yes .. if you want more classes add to
@mixim– לבני מלכה
Nov 13 '18 at 13:24
Yes .. if you want more classes add to
@mixim– לבני מלכה
Nov 13 '18 at 13:24
1
1
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
Thanks For Help
– Dharmesh Vekariya
Nov 13 '18 at 13:27
1
1
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
happy to help :)
– לבני מלכה
Nov 13 '18 at 13:27
|
show 1 more comment
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53281385%2fcan-possible-transform-translatexy-mixin-function-in-sass%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Its possible !! mixin is like a function in any language, you can pass how much parameters you want, and you can set a start value for it like this
@mixin translateXY($value1, $value2: 30)if you don't pass the second value it will assume 30 as default– João Deroldo
Nov 13 '18 at 12:56