ej tile direction

[Muhammad Izhharuddin Muhammad Marzuqi]

Hi syncfussion, i have an issue to change the ej tile direction. I want to change the ej tile direction to upwards insteads of downwards. Below is an example of menu: 

<e-menu-item url="" text="Pengurusan Passport" image-url="../icon/passport.png" css-class="menubar1">

                <e-menu-child-items>

                    <e-menu-child-item>

                        <e-content-template>

                            <div class="e-tile-group">

                                <div class="e-tile-column">                                   

                                        <ej-tile id="passportlist" image-position="@TileImagePosition.Center" tile-size="@TileSize.Wide" text="Senarai Passport" image-url="../images/tile/windows/passport.png" mouse-down="ListPassport" css-class="tile2"></ej-tile>

                                        <ej-tile id="passportbatch" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" text="Passport Batch" image-url="../images/tile/windows/passportbatch.png" mouse-down="PassportBatch" css-class="tile2"></ej-tile>

                                        <ej-tile id="LaporanPassport" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" text="Ringkasan Laporan" image-url="../images/tile/windows/report.png" mouse-down="LaporanPassport" css-class="tile2"></ej-tile>

                                    </div>

                                </div>

                            

                        </e-content-template>

                    </e-menu-child-item>

                </e-menu-child-items>

            </e-menu-item>

            <e-menu-item url="" text="Maklumat Hadiah" image-url="../icon/gift.png" >

                <e-menu-child-items>

                    <e-menu-child-item>

                        <e-content-template>

                            <div class="e-tile-group">

                                <div class="e-tile-column">    

                                    <ej-tile id="JHGiftInfo" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" text="Pengurusan Hadiah" image-url="../images/tile/windows/manage.png" mouse-down="JHGiftInfo" css-class="tile2"></ej-tile>

                                    <ej-tile id="LaporanHadiah" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" text="Ringkasan Laporan" image-url="../images/tile/windows/report.png" mouse-down="LaporanHadiah" css-class="tile2"></ej-tile>

                                </div>

                            </div>

                        </e-content-template>

                    </e-menu-child-item>

                </e-menu-child-items>

            </e-menu-item>

            <e-menu-item url="" text="Aduan" image-url="../icon/complaints.png">

                <e-menu-child-items>

                    <e-menu-child-item>

                        <e-content-template>

                            <div class="e-tile-group">

                                <div class="e-tile-column">

                                    <ej-tile id="JHComplaintList" image-position="@TileImagePosition.Center" tile-size="@TileSize.Wide" text="Senarai Aduan Jemaah" image-url="../images/tile/windows/complaint1.png" mouse-down="JHComplaintList" css-class="tile2"></ej-tile>

                                    <ej-tile id="ComplaintOption" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" text="Senarai Pilihan Aduan Jemaah" image-url="../images/tile/windows/complaint2.png" mouse-down="ComplaintOption" css-class="tile2"></ej-tile>

                                    <ej-tile id="LaporanAduan" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" text="Ringkasan Laporan" image-url="../images/tile/windows/report.png" mouse-down="LaporanAduan" css-class="tile2"></ej-tile>

                                </div>

                            </div>

                        </e-content-template>

                    </e-menu-child-item>

                </e-menu-child-items>

            </e-menu-item>

[Keerthana Rajendran]

Hi Muhammad,     

     

Query: I want to change the ej tile direction to upwards instead of downwards.     

     

Are you trying to change the text direction of Tile component? If yes, you can change the text position to top instead of bottom using position property. Refer to the following code example:     

   

  <ej-tile id="JHGiftInfo" image-position="@TileImagePosition.Center" tile-size="@TileSize.Medium" image-url="http://asp.syncfusion.com/demos/web/Content/images/Tile/games.png" mouse-down="JHGiftInfo" css-class="tile2">   

            <e-tile-caption text="Pengurusan Hadiah" position="@TileCaptionPosition.InnerTop" />   

        </ej-tile>   

   

Refer to the following sample:   

http://www.syncfusion.com/downloads/support/forum/133414/ze/web_sample_(15)-892206741   

   

If this is not your requirement, kindly revert with more details for your requirement to provide an appropriate solution at the earliest.  

  

Regards,  

Keerthana.